모바일 응답 성을위한 라이트 박스 라이브러리 15 개
라이트 박스는 인기있는 방법 중 하나입니다. 웹상의 오버레이 이미지. 이미지를 클릭하면 라이트 박스가 어떤 형태의 애니메이션으로 팝업되고 배경을 희미하게하여 이미지 자체에 초점을 맞 춥니 다. 이미지의 크기도 더 커집니다. 수년 동안 우리가 알고있는 라이트 박스 자바 스크립트 라이브러리에서 가장 인기있는 것은 모바일 플랫폼에서 그렇게하지 않고 데스크톱에서 잘 수행 할 수있게 해줍니다..
이를 무시하고 반응성에 대한 필요성은 요즘은 좋은 생각이 아닙니다. 이것이 바로이 라이트 박스 라이브러리 15 개를 체크 아웃해야하는 이유입니다.
Hongkiat에 대한 추가 정보 :
- HTML5 대화 상자로 모달 창 만들기
- 반응이 빠른 이미지 갤러리 / 슬라이드 쇼 톱 10
- Vex를 사용하여 사이트에 대한 더 나은 모달 창 만들기, 제어 및 사용자 정의
- jQuery 이미지 갤러리 및 슬라이더 - Best Of
PhotoSwipe
PhotoSwipe 지금까지 내가 제일 좋아하는 ligthbox 플러그인입니다. 가볍고 터치가 가능하며 가장 중요하게 모듈화되어있어 필요하지 않은 부분을 버릴 수 있습니다. 그것은 모바일 브라우저에서 잘 실행됩니다. 네이티브 앱에서와 같이 손가락으로 이미지를 스 와이프 할 수 있으며 전환이 실제로 부드럽게 실행됩니다..
- 의존: 없음
- 브라우저 지원: IE8 +, Chrome, Firefox, Safari, Opera 및 몇 가지 모바일 브라우저.
- 특허: MIT 라이센스
Magnificopopup
Magnificopopup 우리에게 PhotoSwipe, Dmitry Semenov를 준 사람이 개발 한 또 다른 라이트 박스 플러그인입니다. jQuery / Zepto 플러그인의 형태로 제공되며, VideoSync, Map 및 Ajax 콘텐츠 지원과 같은 PhotoSwipe에없는 기능을 제공합니다. 더 많은 기능을 더 선호하는 사람들에게 훌륭한 대안입니다..
- 의존: jQuery 1.9.1+ 또는 Zepto.js
- 브라우저 지원: IE7 (일부), IE8 +, Chrome, Firefox, Safari 및 Opera.
- 특허: MIT 라이센스
SwipeBox
스 와이프 박스 모바일 플랫폼에 대한 터치 제스처 지원이 포함 된 jQuery 플러그인입니다. 또한 이미지 외에도 Youtube 및 Vimeo의 비디오를 지원합니다. 또한 Swipebox는 구현하기가 쉽고 동작을 사용자 정의 할 수있는 몇 가지 옵션이 있습니다. 나는 Swipebox가 JavaScript noobs를위한 훌륭한 라이트 박스 플러그인이라고 생각한다..
- 의존: jQuery
- 브라우저 지원: IE9 +, Chrome, Safari, Firefox, Opera, IOS4 +, Android 및 Windows Phone.
- 특허: 정의되지 않음
iLightbox
iLighbox Flash / SWF, Ajax 콘텐츠, iframe 및지도를 포함하여 다양한 미디어 유형을 지원하는 jQuery 라이트 박스 플러그인입니다. 이 플러그인은 미디어 상단에 소셜 미디어 버튼을 추가하여 사용자가 Facebook, Twitter 또는 Reddit과 공유 할 수 있도록합니다. 또한 고급 섹션에서 다양한 시나리오에서 iLightbox를 적용하는 방법을 확인하십시오..
- 의존: jQuery
- 브라우저 지원: IE7 +, Chrome, Firefox, Safari 및 Opera
- 특허: 정의되지 않음
부트 스트랩 라이트 박스
라이트 박스 부트 스트랩에서 눈에 띄지 않는 부분 중 하나입니다. 이 플러그인으로 문제가 해결됩니다. 부트 스트랩을 사용하는 경우이 라이브러리를 사용하는 것이 좋습니다. 플러그인은 부트 스트랩의 코드 기반과 잘 통합되어 있습니다..
- 의존: jQuery 및 부트 스트랩 모달
- 브라우저 지원: IE8 +, Chrome, Firefox, Safari 및 Opera
- 특허: GNU 라이센스
Nivo Lightbox
Nivo Lightbox 유연한 라이트 박스 플러그인입니다. 테마 변경, 전환 효과 및 탐색 전환과 같이 모양이 마음에 드는 방식으로 변경되도록 여러 가지 옵션이 포함되어 있습니다.
- 의존: jQuery
- 브라우저 지원: IE9 +, Chrome, Firefox, Safari 및 Opera
- 특허: MIT 라이센스
ImageLightbox
ImageLightbox 부 풀리지 않는 라이트 박스 플러그인입니다. 이미지 용으로 특별히 제작되었으므로 이름이 지정되었습니다. 비디오 나 다른 미디어 유형은 지원되지 않습니다. 또한 외부 HTML 마크 업이 필요하지 않습니다. 그만큼 요소가 충분합니다. 플러그인 만 작동합니다..
- 의존: jQuery
- 브라우저 지원: IE9 +, Chrome, Firefox, Safari 및 Opera
- 특허: 정의되지 않음
미니 라이트 박스
부 풀지 않는 라이트 박스 플러그인. 라이브러리는 2kb이며 이미지로만 작동합니다. 최신 브라우저를 지정하고 동영상과 같은 다른 미디어 유형을 오버레이 할 필요가없는 경우 완벽한 플러그인입니다..
- 의존: 없음
- 브라우저 지원: IE10 +, Chrome, Firefox, Safari 및 Opera
- 특허: MIT 라이센스
라이트 케이스
Lightcase는 멋진 라이트 박스 플러그인입니다. 페이드 (fade), 탄성 줌 (elastic zoom), 스크롤링 (scrolling)과 같은 사용자 상호 작용을 생생하게 만들어주는 여러 애니메이션이 제공됩니다. 또한 Youtube embed, HTML 비디오, SWF 및 입력 양식을 포함한 다양한 유형의 미디어를 지원합니다. 플러그인에서 미디어를 제대로 처리 할 수 없거나 오류를 발견했습니다.
- 의존: jQuery
- 브라우저 지원: IE9 +, Chrome, Firefox, Safari 및 Opera
- 특허: GPL 라이센스
얄프
얄프 그러나 또 다른 라이트 박스를 의미합니다. Yalb에는 라이트 박스 상태를 식별 할 수있는 맞춤 이벤트를 포함하여 몇 가지 API가 제공됩니다 (예 : 라이트 박스 상태). 열다
그리고 그것이 언제인지 닫기
. Yalb는 두 가지 버전 인 Vanilla JavaScript와 jQuery 플러그인으로 제공됩니다..
- 의존: 없음
- 브라우저 지원: IE9 +, Chrome, Firefox, Safari 및 Opera
- 특허: MIT 라이센스
깃털처럼 가벼운
6kb 깃털처럼 가벼운 정통한 개발자를위한 맨손으로 플러그인이며 필수 요소 만 운반합니다. 예를 들어 갤러리에서 이미지 라이트 박스를 그룹화해야하는 경우 갤러리 확장을 포함 할 수 있습니다. 이 플러그인이 프로젝트 요구 사항에 맞게 확장 할 수 있습니다..
- 의존: jQuery
- 브라우저 지원: IE8 +, Chrome, Firefox, Safari 및 Opera
- 특허: MIT 라이센스
라이트 레이어
LightLayer는 라이트 박스 플러그인을 사용하기 쉽습니다. 몇 가지 옵션, 맞춤 자바 스크립트 메소드 및 맞춤 이벤트가 있습니다. 플러그인은 이미지, 비디오,지도 및 외부 콘텐츠로 작동합니다. 우리가 할 수있는 것은 무엇입니까?.
- 의존: jQuery
- 브라우저 지원: IE9 +, Chrome, Firefox, Safari 및 Opera
- 특허: MIT 라이센스
LightGallery
LightGallery, 많은 기능이 추가 된 다른 라이트 박스 플러그인. 라이트 박스의 가장 미세한 세부 사항을 사용자 정의하는 20 가지 이상의 옵션이 제공됩니다.
- 의존: jQuery
- 브라우저 지원: IE7 +, Chrome, Firefox, Safari, Opera, iOS, Android 및 Windows Phone
- 특허: MIT 라이센스
FluidBox
유체 상자 매체에서 영감을받은 이미지 라이트 박스 플러그인입니다. 이미지와 함께 떠 다니는 이미지, 이미지와 함께 다양한 상황에서 작동합니다. 순수한
위치, 테두리 및 패딩이있는 이미지 및 갤러리가 있습니다. 어떻게 구축되었는지 확인하십시오. WordPress 플러그인이 필요한 경우.
- 의존: jQuery
- 브라우저 지원: IE9 이상, Chrome, Firefox, Safari, Opera
- 특허: MIT 라이센스
StripJS
StripJS 고유 한 라이트 박스 플러그인입니다. 이미지를 오버레이하는 대신 플러그인이 이미지를 측면에서 밀어 넣어 전체 내용을 차단하지 않도록합니다. StripJS는 이미지와 비디오를 모두 지원합니다..
- 의존: jQuery
- 브라우저 지원: IE7 +, Chrome, Firefox, Safari, Opera, iOS 5 이상, Android 3+
- 특허: 크리에이티브 커먼즈 BY-NC-ND 3.0 라이센스