ENG
  • KOR
  • ENG
  • JPN

lightgallery

ui-component responsive modal

lightgallery는 jQuery를 기반으로 한 가벼우면서도 사용자 정의가 가능한 모듈식 반응형 라이트박스 갤러리 플러그인입니다. 이 라이브러리를 통해 이미지, 비디오 등의 미디어 콘텐츠를 아름답고 효과적으로 표시할 수 있습니다.

Latest Ver 2.8.3
Homepage
Github
0
6,711
빛을 따라가면 갤러리가 열린다.
라이트갤러리와 함께 아름다운 이미지와 비디오를 근사하게 전시하세요.
jQuery 기반의 경량 라이트박스 갤러리 플러그인

CDN 다운로드

License: MIT
전체 버전 보기
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.es5.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.es5.min.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.min.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.umd.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/lightgallery.umd.min.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.es5.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.es5.min.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.min.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.umd.js
https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/plugins/autoplay/lg-autoplay.umd.min.js

Sample Code

⚠️ import 문을 포함한 일부 코드는 jsFiddle에서 정상 실행되지 않을 수 있습니다. 실행 오류가 발생할 경우 코드 복사 후 직접 실행해보세요. 
📄 HTML
<div id="lightgallery"><a href="image1.jpg"><img src="thumb1.jpg"/></a><a href="image2.jpg"><img src="thumb2.jpg"/></a></div><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.0.0/js/lightgallery.min.js"></script><script>$(document).ready(function() { $('#lightgallery').lightGallery(); });</script>

🎨 External CSS
<link href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.0.0/css/lightgallery.min.css" rel="stylesheet">

🧩 External JS
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/1.0.0/js/lightgallery.min.js"></script>

⚙️ JavaScript
$(document).ready(function() { $('#lightgallery').lightGallery(); });

Related Libraries

Library Icon
jquery

jQuery는 웹 개발에서 DOM 요소를 쉽게 조작할 수 있게 해주는 경량의 크로스 플랫폼 JavaScript 라이브러리입니다. 이벤트 처리, 애니메이션 및 Ajax와 같은 기능을 간편하게 사용할 수 있도록 설계되었습니다.

Library Icon
lightbox2

Lightbox2는 이미지를 현재 페이지 위에 오버레이하는 기능을 제공하는 자바스크립트 라이브러리입니다.

⚡ Top Tools for Developers
Text Compare

텍스트 비교

두 텍스트의 차이점을 한눈에 확인하세요.

Favicon Generator

Favicon 생성기

파비콘을 쉽고 빠르게 생성하세요.

Lorem Ipsum Generator

Lorem Ipsum 생성기

디자인을 위한 더미 텍스트를 생성하세요.

Character Counter

글자수 세기

글자 수와 단어 수를 실시간으로 확인하세요.

SRT ↔ SMI

SRT ↔ SMI 변환기

자막 형식을 간편하게 변환합니다.

Text Extract(OCR)

이미지 텍스트 추출

이미지 속 텍스트 자동 추출