[해피CGI][cgimall] Responsive Touch-enabled Image Lightbox Plugin

데스크톱 및 모바일 웹 사이트에서
이미지 라이트 박스 및 갤러리 라이트 박스를 만들 수 있습니다.

첨부된 파일을 다운로드 해서,
압축을 해제하고 나면 demo 라는 폴더가 있습니다.

demo 폴더에 있는,
demo/index.html 파일과,
demo/onlyImages.html 파일을 웹브라우저로 열어보면 확인이 가능합니다.

위 와 같은 화면이 표시가 되고,
우측의 이미지를 클릭 해보면,

위 그림과 같이 이미지를 슬라이더로 표시하는 기능을 확인하는게 가능합니다.



사용법은 아래와 같습니다.

지원되는 옵션들은 다양하며,
반응형 터치 지원 이미지 라이트박스 플러그인 | 무료 jQuery 플러그인 (jqueryscript.net)
위 페이지에서 확인이 가능하겠습니다.

그 외의 method 및 event 는 아래와 같습니다.

6. 이벤트

open.simplelightbox : 라이트박스가 열리기 전에 발생

opened.simplelightbox : 라이트박스를 연 후 발생

close.simplelightbox : 라이트박스가 닫히기 전에 발생

closed.simplelightbox : 라이트박스가 닫힌 후 발생

change.simplelightbox : 이미지가 변경되기 전에 발생

changed.simplelightbox : 이미지 변경 후 발생

next.simplelightbox : 다음 이미지가 도착하기 전에 발생

nextDone.simplelightbox : 다음 이미지가 도착하기 전에 발생

prev.simplelightbox : 이전 이미지가 도착하기 전에 실행

prevDone.simplelightbox : 이전 이미지가 도착한 후 실행

nextImageLoaded.simplelightbox : 다음 이미지가 로드된 후 발생합니다(사전 로드가 활성화된 경우).

prevImageLoaded.simplelightbox : 이전 이미지가 로드된 후 실행됩니다(사전 로드가 활성화된 경우).

error.simplelightbox : 이미지 로드 오류 발생 시 발생

 

이벤트에 핸들러를 연결하는 예제는 아래와 같습니다.