ปลั๊กอินแกลเลอรีภาพที่ตอบสนองและปรับแต่งได้

เริ่มต้นใช้งาน LightGallery

วิธีที่แนะนำในการติดตั้ง LightGallery ผ่าน NPM โปรดใช้คำสั่งต่อไปนี้เพื่อติดตั้ง

 npm install lightgallery.js

ฟรี JavaScript API สำหรับการจัดการรูปภาพ

Lightgallery.js มาพร้อมกับโมดูลในตัวมากมาย เช่น การสร้างภาพขนาดย่อ เต็มหน้าจอ ซูมเข้าและออก ฯลฯ ซึ่งสามารถละทิ้งได้หากคุณไม่ต้องการ คุณยังสามารถเพิ่มโมดูลของคุณเองได้ตามความต้องการของโครงการของคุณ ตรงข้ามกับวิธีการปรับขนาดรูปภาพและวิดีโอของ JavaScript Lightgallery.js ใช้แนวทาง CSS เท่านั้นสำหรับการปรับขนาดแบบตอบสนองทำให้เร็วขึ้นและยืดหยุ่นมากขึ้น เพียงแค่อัปเดตตัวแปร SASS ของแกลเลอรีของคุณ คุณจะสามารถปรับแต่งปลั๊กอินให้เหมาะกับความต้องการของคุณได้อย่างง่ายดาย

สร้างภาพขนาดย่อผ่าน 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,
});