lightgallery-js

ui-component modal animation

lightgallery-js는 외부 의존성이 없는 전체 기능을 갖춘 라이트박스 갤러리 라이브러리입니다. 이미지, 동영상, HTML 콘텐츠를 아름답게 표시하기 위한 다양한 기능을 제공합니다.

Latest Ver 1.4.0

Homepage

Github

5,330

빛을 담다, 갤러리가 되다.

사진과 비디오를 아름답게 전시하는 현대적 갤러리를 경험하세요.

lightgallery-js는 이미지, 비디오, HTML을 아름답게 표시할 수 있는 라이트박스 갤러리입니다.

CDN 다운로드

License: GPLv3

Asset Type :

전체 버전 보기

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/js/lightgallery.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/js/lightgallery.min.js

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lg-fb-comment-box.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lg-fb-comment-box.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lg-transitions.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lg-transitions.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lightgallery.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lightgallery.min.css

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lg-fb-comment-box.css.map

https://cdnjs.cloudflare.com/ajax/libs/lightgallery-js/1.4.0/css/lg-transitions.css.map

Sample Code

⚠️ import 문을 포함한 일부 코드는 jsFiddle에서 정상 실행되지 않을 수 있습니다. 실행 오류가 발생할 경우 코드 복사 후 직접 실행해보세요.

📄 HTML
<div id="lightgallery"><a href="path-to-image.jpg"><img src="thumbnail-image.jpg"/></a></div><script src="https://cdn.jsdelivr.net/npm/lightgallery.js"></script><script>lightGallery(document.getElementById('lightgallery'));</script>

🎨 External CSS
<link href="https://cdn.jsdelivr.net/npm/lightgallery.js/dist/css/lightgallery.min.css" rel="stylesheet">

🧩 External JS
<script src="https://cdn.jsdelivr.net/npm/lightgallery.js"></script>

⚙️ JavaScript
lightGallery(document.getElementById('lightgallery'));