LightBox는 Web에서 이미지를 오버레이하는 일반적인 방법입니다. 이미지를 클릭하면 라이트 박스는 어떤 형식의 애니메이션 팝업 배경을 흐리게하여 이미지 자체에 초점을 맞추고 있습니다. 이미지도 크고 커지고 있습니다. 우리가 오랫동안 알고 있었다 가장 인기있는 라이트 박스 JavaScript 라이브러리는 데스크톱에서이를 희망하지만, 모바일 플랫폼에서는 그리 많지 않습니다.
이를 무시하고 응답의 필요성은 오늘의 좋은 생각이 아닙니다. 따라서 15의 응답 라이트 박스 라이브러리 컬렉션을 체크 아웃해야하는 이유입니다.
Lightbox is one popular way to overlay images on the web. When you click on an image, the Lightbox pops up with some form of animation and dims the background so your focus is on the image itself. The image is also larger in scale. Most popular Lightbox JavaScript libraries that we have known for years let you do this well on a desktop, but not so much on mobile platforms.
Neglecting this, and the need for responsiveness, is not a good idea nowadays, which is why this collection of 15 responsive Lightbox libraries must be checked out.
포토 웨이는 훨씬 내가 좋아하는 Ligthbox 플러그인 때문입니다. 그것은 빛, 터치 활성화, 그리고 가장 중요한 수, 내가 필요로하지 않는 몇 가지 부분을 버릴 것을 가능하게하는 모듈 식. 모바일 브라우저에서 잘 작동합니다. 기본 응용 프로그램처럼 손가락으로 이미지를 슬쩍 수 전이 정말 부드러워집니다.
- Dependency: None
- Browser Support: IE8+, Chrome, Firefox, Safari, Opera, and a couple of mobile browsers.
- License: MIT license
MagnificPopup는 Photoswipe, Dmitry Semenov을 준 것과 같은 사람에 의해 개발 된 또 다른 라이트 박스 플러그인입니다. jQuery / Zepto 플러그인 형태로, 비디오,지도 및 Ajax 컨텐츠 지원 등 사진 웨인에 누락 된 기능도 소개합니다. 이것은 수중의 더 많은 기능을 가지는 것을 선호하는 사람들을위한 훌륭한 대안입니다.
- Dependency: jQuery 1.9.1+, or Zepto.js
- Browser Support: IE7 (partially), IE8+, Chrome, Firefox, Safari, and Opera.
- License: MIT license
스위치 박스는 모바일 플랫폼을위한 터치 제스처 지원이있는 jQuery 플러그인입니다. 또한 YouTube 및 Vimeo의 비디오를 이미지에서 제외하고는 비디오를 지원합니다. 스 와이핑 (Swipe) 박스는 또한 다운로드가 쉽고 해동을 사용자 정의 할 수있는 몇 가지 옵션이 있습니다. 스위치 박스는 JavaScript Noobs 용 훌륭한 라이트 박스 플러그인이라고 생각합니다.
- Dependency: jQuery
- Browser Support: IE9+, Chrome, Safari, Firefox, Opera, IOS4+, Android, and Windows Phone.
- License: Undefined
Ilighbox는 비디오, Flash / SWF, Ajax 콘텐츠, iframe 및 맵을 포함하여 미디어 유형의 광범위한 지원을 갖춘 jQuery 라이트 박스 플러그인입니다. 이 플러그인은 또한 미디어 위에 소셜 미디어 버튼을 추가하여 사용자가 Facebook, Twitter 또는 RedDit으로 공유 할 수 있습니다. 또한 고급 섹션을 확인하여 IlightBox를 다른 시나리오에서 적용 할 수있는 방법을 확인하십시오.
- Dependency: jQuery
- Browser Support: IE7+, Chrome, Firefox, Safari, and Opera
- License: Undefined
라이트 박스는 부트 스트랩으로부터 눈에 띄지 않는 부분 중 하나입니다. 이 플러그인은 그렇게 해결합니다. 부트 스트랩을 사용하는 경우이 라이브러리를 사용하는 것이 좋습니다. 플러그인은 부트 스트랩의 코드 기반과 잘 통합되어 있습니다.
- Dependency: jQuery and Bootstrap Modal
- Browser Support: IE8+, Chrome, Firefox, Safari, and Opera
- License: GNU license
Nivo LightBox는 유연한 라이트 박스 플러그인입니다. 테마 변경, 전환 효과 및 탐색을 전환하는 것과 같이 외관을 표시하는 방식으로 모양을 표시하는 데 나타나는 여러 가지 옵션이 포함됩니다.
- Dependency: jQuery
- Browser Support: IE9+, Chrome, Firefox, Safari, and Opera
- License: MIT license
ImageLightBox는 블로트가없는 라이트 박스 플러그인입니다. 특별히 이미지를 구축하므로 주어진 이름 - 비디오 또는 기타 미디어 유형이 지원되지 않습니다. 그것은 또한 불필요한 HTML 마크 업이 필요하지 않습니다. <img> 요소가 충분합니다. 플러그인은 방금 작동합니다.
- Dependency: jQuery
- Browser Support: IE9+, Chrome, Firefox, Safari, and Opera
- License: Undefined
다른 라이트 박스는 블로우가없는 플러그인. 라이브러리는 2KB이며 이미지에서만 작동합니다. 최신 브라우저에서만 지정하고 비디오와 같은 다른 미디어 유형을 오버레이 할 필요가없는 경우 완벽한 플러그인입니다.
- Dependency: None
- Browser Support: IE10+, Chrome, Firefox, Safari, and Opera
- License: MIT license
라이트 케이스는 사랑스러운 라이트 박스 플러그인입니다. 페이드, 탄성 줌 및 스크롤과 같은 사용자 상호 작용을 생생하게 만드는 여러 애니메이션이 있습니다. 또한 YouTube Embed, HTML 비디오, SWF 및 입력 양식을 포함한 다양한 유형의 미디어를 지원합니다. 플러그인은 또한 미디어를 제대로 처리 할 수 없거나 오류를 찾을 수 없습니다.
- Dependency: jQuery
- Browser Support: IE9+, Chrome, Firefox, Safari, and Opera
- License: GPL license
6KB Featherlight는 Savvy Developer를위한 베어 플러그인이며 필수 요소 만 수행합니다. 예를 들어 갤러리에서 이미지 라이트 박스를 그룹화하려면 갤러리 확장을 포함 할 수 있습니다. 또한 프로젝트 요구에 맞게이 플러그인에 대한 자신의 확장 프로그램을 개발할 수도 있습니다.
- Dependency: jQuery
- Browser Support: IE8+, Chrome, Firefox, Safari, and Opera
- License: MIT license
lightlayer는 사용하기 쉬운 라이트 박스 플러그인입니다. 소수의 옵션, 사용자 정의 JavaScript 메소드 및 사용자 정의 이벤트가 있습니다. 플러그인은 이미지, 비디오,지도 및 외부 콘텐츠와 함께 작동합니다. 우리가 더 많이 묻는 일은 무엇입니까?
- Dependency: jQuery
- Browser Support: IE9+, Chrome, Firefox, Safari, and Opera
- License: MIT license
LightGallery, 많은 기능을 많이 갖춘 다른 라이트 박스 플러그인이 추가되었습니다. 라이트 박스의 가장 작은 세부 사항을 사용자 정의하는 20 가지 이상의 옵션이 제공됩니다.
- Dependency: jQuery
- Browser Support: IE7+, Chrome, Firefox, Safari, Opera, iOS, Android, and Windows Phone
- License: MIT license
Fluidbox는 매체에서 영감을 얻은 이미지 라이트 박스 플러그인입니다. 그것은 플로팅 이미지, 절대 위치가있는 이미지, 테두리 및 패딩이있는 이미지, 갤러리를 포함한 다양한 상황에서 이미지와 함께 작동합니다. WordPress 플러그인이 필요한 경우 하나가 있습니다.
- Dependency: jQuery
- Browser Support: IE9+, Chrome, Firefox, Safari, Opera
- License: MIT license
Stripjs는 고유 한 라이트 박스 플러그인입니다. 이미지를 오버레이하는 대신 플러그인은 이미지를 측면에서 슬라이드하여 전체 콘텐츠를 차단하지 않습니다. Stripjs는 이미지와 비디오를 모두 지원합니다.
- Dependency: jQuery
- Browser Support: IE7+, Chrome, Firefox, Safari, Opera, iOS 5+, and Android 3+
- License: Creative Commons BY-NC-ND 3.0 license
'Study > 개발 Tip' 카테고리의 다른 글
| npm install err MSBuild 관련 문제 해결법 (0) | 2021.08.12 |
|---|---|
| 각종 클론 소스 모음 (0) | 2021.08.08 |
| [Github] Github의 몰랐던 유용한 기능 공개! | Github 더 똑똑하게 사용해보자! (0) | 2021.06.27 |
| [Google Cloud Platform] Google Cloud Linux 서버를 얻는 방법 | 무료 사용 가능 (0) | 2021.06.25 |
| [Regex Code Util] Useful Regex Code Snippets For Web Developers | 웹 개발자를위한 유용한 정규식 코드 조각 (0) | 2021.06.21 |
|
|
|
|
|