תוסף גלריית תמונות רספונסיבי וניתן להתאמה אישית

תחילת העבודה עם LightGallery

הדרך המומלצת להתקין את LightGallery דרך NPM. אנא השתמש בפקודה הבאה כדי להתקין אותו.

 npm install lightgallery.js

ממשק API של JavaScript בחינם לעיבוד תמונה

Lightgallery.js מגיע עם מודולים מובנים רבים כמו יצירת תמונות ממוזערות, מסך מלא, הגדלה והקטנה וכו' שניתן לזרוק אותם אם אינך זקוק להם. אתה יכול גם להוסיף מודולים משלך בהתאם לדרישת הפרויקט שלך. בניגוד לשיטת JavaScript של שינוי גודל של תמונות וסרטונים, Lightgallery.js משתמש בגישת CSS בלבד לשינוי גודל רספונסיבי מה שהופך אותו למהיר וגמיש יותר. פשוט על ידי עדכון משתני SASS של הגלריה שלך, אתה יכול בקלות להתאים אישית את התוסף כך שיתאים לצרכים שלך.

צור תמונות ממוזערות באמצעות API של JavaScript בחינם

כשזה מגיע לתמונות ממוזערות, 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,
});