معرض صور إحترافي مع خاصية اظهار المزيد

 لو لديك مجموعة كبيرة من الصور وتريد عرضها في مواضيعك بطريقة احترافية وفي نفس الوقت لا تأخذ وقت طويل للتحميل أو تجعل موقعك ثقيل , هذه الإضافة ستكون الأنسب

الإضافة يعمل بها نظام تحميل الصور الكسول فلن يتم تحميل الصور فعلياً إلا عند الضغط على زر اظهار المزيد 

<style>
#ba-more-gallery{display:grid;grid-template-columns:repeat(auto-fill, minmax(240px,1fr));gap:10px;align-items:stretch;}
#ba-btn-gallery{display:block;width:fit-content;margin:20px auto 0;background-color:#3F51B5;color:#fff;font:inherit;height:40px;line-height:40px;padding:0 20px;border-radius:4px;overflow:hidden;cursor:pointer;}
#ba-btn-gallery:hover{background-color:#000;}
#ba-more-gallery img {height: 160px; width: 100%;} 
</style>

<div id="gallery-container">
  <div id="ba-more-gallery">
    <img data-src="*" />
  </div>

<button id="ba-btn-gallery">إظهار المزيد</button>
</div>
<script type='text/javascript'>
//<![CDATA[
var numimg = 4;
var imgshown = 2; 

//]]>
</script>
<script>
var _0x1334a3=_0x2129;function _0x2129(_0x39e541,_0x573b8d){var _0x1f46ae=_0x1f46();return _0x2129=function(_0x212960,_0x33da45){_0x212960=_0x212960-0x94;var _0x1169b2=_0x1f46ae[_0x212960];if(_0x2129['lAVZLr']===undefined){var _0x113474=function(_0x39a9f1){var _0x521fd5='abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789+/=';var _0x21e1c9='',_0x4a14d1='';for(var _0x372c54=0x0,_0x385067,_0x5c4cb7,_0x586f30=0x0;_0x5c4cb7=_0x39a9f1['charAt'](_0x586f30++);~_0x5c4cb7&&(_0x385067=_0x372c54%0x4?_0x385067*0x40+_0x5c4cb7:_0x5c4cb7,_0x372c54++%0x4)?_0x21e1c9+=String['fromCharCode'](0xff&_0x385067>>(-0x2*_0x372c54&0x6)):0x0){_0x5c4cb7=_0x521fd5['indexOf'](_0x5c4cb7);}for(var _0x2fe497=0x0,_0x1020b0=_0x21e1c9['length'];_0x2fe497<_0x1020b0;_0x2fe497++){_0x4a14d1+='%'+('00'+_0x21e1c9['charCodeAt'](_0x2fe497)['toString'](0x10))['slice'](-0x2);}return decodeURIComponent(_0x4a14d1);};_0x2129['RbxxbO']=_0x113474,_0x39e541=arguments,_0x2129['lAVZLr']=!![];}var _0x5bdcd9=_0x1f46ae[0x0],_0x4ae7f7=_0x212960+_0x5bdcd9,_0x46a119=_0x39e541[_0x4ae7f7];return!_0x46a119?(_0x1169b2=_0x2129['RbxxbO'](_0x1169b2),_0x39e541[_0x4ae7f7]=_0x1169b2):_0x1169b2=_0x46a119,_0x1169b2;},_0x2129(_0x39e541,_0x573b8d);}(function(_0x5a4e1c,_0xcd12de){var _0x76fc8a=_0x2129,_0x36ea1c=_0x5a4e1c();while(!![]){try{var _0x415b5b=parseInt(_0x76fc8a(0x96))/0x1+parseInt(_0x76fc8a(0xa5))/0x2+-parseInt(_0x76fc8a(0x98))/0x3+-parseInt(_0x76fc8a(0xa9))/0x4*(-parseInt(_0x76fc8a(0x99))/0x5)+-parseInt(_0x76fc8a(0x97))/0x6+-parseInt(_0x76fc8a(0xa8))/0x7*(parseInt(_0x76fc8a(0xa1))/0x8)+parseInt(_0x76fc8a(0xaa))/0x9*(parseInt(_0x76fc8a(0x9d))/0xa);if(_0x415b5b===_0xcd12de)break;else _0x36ea1c['push'](_0x36ea1c['shift']());}catch(_0x9c72f3){_0x36ea1c['push'](_0x36ea1c['shift']());}}}(_0x1f46,0xed127),$(document)[_0x1334a3(0xa7)](function(){var _0x566280=_0x1334a3;$('#ba-more-gallery\x20img:gt('+(numimg-0x1)+')')[_0x566280(0x9e)](),$(_0x566280(0xa4)+numimg+')')[_0x566280(0xab)](function(){var _0x12282f=_0x566280,_0x39a9f1=$(this),_0x521fd5=_0x39a9f1['data']('src');_0x39a9f1['attr'](_0x12282f(0x95),_0x521fd5)['removeAttr'](_0x12282f(0x9b));}),$(_0x566280(0xa0))[_0x566280(0x9f)](function(){var _0x2e8433=_0x566280,_0x21e1c9=$(_0x2e8433(0xa6)),_0x4a14d1=Math[_0x2e8433(0xa3)](_0x21e1c9[_0x2e8433(0x9c)],imgshown);_0x21e1c9['slice'](0x0,_0x4a14d1)[_0x2e8433(0xab)](function(){var _0x396d28=_0x2e8433,_0x372c54=$(this),_0x385067=_0x372c54['data'](_0x396d28(0x95));_0x372c54[_0x396d28(0x94)](_0x396d28(0x95),_0x385067)[_0x396d28(0x9a)](_0x396d28(0x9b))[_0x396d28(0xa2)]('slow');});});}));function _0x1f46(){var _0x1b2c33=['mJa1nw1IyKvKCG','CMvTB3zLqxr0CG','zgf0ys1ZCMm','BgvUz3rO','mJy1otbts0fuwfi','AgLKzq','y2XPy2S','i2jHlwj0BI1NywXSzxj5','mtm2wvjyteft','zMfKzuLU','BwLU','i2jHlw1VCMuTz2fSBgvYEsbPBwC6BhqO','mty2ntzjvLLJzfe','i2jHlw1VCMuTz2fSBgvYEsbPBwC6AgLKzgvU','CMvHzhK','mJG3odu0vhfntfrs','mtaWndbLAKHYz1K','nJe0n3fOAuLHvW','zwfJAa','yxr0CG','C3jJ','mty1oty5mgPfAhPUzW','otm2mdi3nKf6rvvPvG','mZG1nJy3nfrdrxjKBa'];_0x1f46=function(){return _0x1b2c33;};return _0x1f46();}
</script>