البرنامج المساعد معرض الصور سريع الاستجابة وقابل للتخصيص

الشروع في العمل مع LightGallery

الطريقة الموصى بها لتثبيت LightGallery عبر NPM. الرجاء استخدام الأمر التالي لتثبيته.

 npm install lightgallery.js

واجهة برمجة تطبيقات JavaScript API مجانية لمعالجة الصور

يأتي Lightgallery.js بالعديد من الوحدات المدمجة مثل إنشاء الصور المصغرة ، ملء الشاشة ، التكبير والتصغير ، وما إلى ذلك ، والتي يمكن تجاهلها إذا لم تكن بحاجة إليها. يمكنك أيضًا إضافة وحداتك الخاصة وفقًا لمتطلبات مشروعك. على عكس طريقة JavaScript لتغيير حجم الصور ومقاطع الفيديو ، يستخدم Lightgallery.js نهج CSS فقط لتغيير الحجم سريع الاستجابة مما يجعله أسرع وأكثر مرونة إلى حد كبير. بمجرد تحديث متغيرات SASS في معرض الصور الخاص بك ، يمكنك بسهولة تخصيص المكون الإضافي ليناسب احتياجاتك.

قم بإنشاء صور مصغرة عبر Free JavaScript API

عندما يتعلق الأمر بالصور المصغرة ، يتيح لك Lightgallery.js تمكين الصور المصغرة المتحركة تمامًا مثل YouTube لإضفاء طابع أكثر حداثة. يمكن أيضًا تنشيط الصور المصغرة المتحركة لمعرض YouTube أو Vimeo. يأتي Lightgallery.js مع أكثر من 20 صورة متحركة مضمنة في المكون الإضافي والتي يمكن استخدامها لإنشاء معارض جميلة.

 lightGallery(document.getElementById('static-thumbnails'), {
    animateThumb: false,
    zoomFromOrigin: false,
    allowMediaOverlap: true,
    toggleThumb: true,
});

 lightGallery(document.getElementById('customize-thumbnails-gallery'), {
    // Add a custom class to apply style only for the particular gallery
    addClass: 'lg-custom-thumbnails',
    // Remove the starting animations.
    // This can be done by overriding CSS as well
    appendThumbnailsTo: '.lg-outer',
    animateThumb: false,
    allowMediaOverlap: true,
});