Lightbox是一种在网络上叠加图像的流行方式。当您单击图像时,灯箱会弹出某种形式的动画并使背景变暗,因此您的焦点在于图像本身。图像的比例也更大。我们多年来所知道的最流行的Lightbox JavaScript库让您可以在桌面上做到这一点,但在移动平台上却不是这么做。
忽视这一点,以及对响应性的需求,现在不是一个好主意,这就是为什么必须检查这15个响应式Lightbox库的集合。
PhotoSwipe
PhotoSwipe是我最喜欢的ligthbox插件。它具有轻巧,触控功能,最重要的是模块化设计,可以让我放弃一些不需要的部件。它在移动浏览器中运行良好。您可以像在本机应用程序中一样用手指轻扫图像,并且过渡运行非常顺畅。
- 依赖性:无
- 浏览器支持:IE8 +,Chrome,Firefox,Safari,Opera和几个移动浏览器。
- 许可证:MIT许可证
MagnificPopup
MagnificPopup是另一个灯箱插件,由给我们PhotoSwipe,Dmitry Semenov的同一个人开发。它以jQuery / Zepto插件的形式出现,并且还带来PhotoSwipe中缺少的功能,例如支持Video,Map和Ajax内容。对于那些喜欢手头有更多功能的人来说,这是一个很好的选择。
- 依赖性:jQuery 1.9.1+或Zepto.js
- 浏览器支持:IE7(部分),IE8 +,Chrome,Firefox,Safari和Opera。
- 许可证:MIT许可证
SwipeBox
Swipebox是一个jQuery插件,支持移动平台的触摸手势。除图像外,它还支持Youtube和Vimeo的视频。Swipebox也很容易实现,并且有一些选项可以自定义它的行为。我认为Swipebox是一款适用于JavaScript新手的精彩灯箱插件。
- 依赖:jQuery
- 浏览器支持:IE9 +,Chrome,Safari,Firefox,Opera,IOS4 +,Android和Windows Phone。
- 许可证:未定义
iLightbox
iLighbox是一个jQuery灯箱插件,提供广泛的媒体类型支持:包括视频,Flash / SWF,Ajax内容,iframe和地图。此插件还在媒体上添加了社交媒体按钮,允许您的用户将其分享到Facebook,Twitter或Reddit。另请查看高级部分,了解iLightbox如何在不同场景中应用。
- 依赖:jQuery
- 浏览器支持:IE7 +,Chrome,Firefox,Safari和Opera
- 许可证:未定义
Lightbox for Bootstrap
Lightbox是Bootstrap中一个明显缺失的部分。这个插件修复了这个问题。如果您使用的是Bootstrap,我强烈建议您使用此库。该插件与Bootstrap的代码库完美集成。
- 依赖:jQuery和Bootstrap Modal
- 浏览器支持:IE8 +,Chrome,Firefox,Safari和Opera
- 许可证:GNU许可证
Nivo灯箱
Nivo Lightbox是一款灵活的灯箱插件。包含几个选项可将外观更改为您希望显示的方式,例如更改主题,过渡效果和切换导航。
- 依赖:jQuery
- 浏览器支持:IE9 +,Chrome,Firefox,Safari和Opera
- 许可证:MIT许可证
ImageLightbox
ImageLightbox是一个没有膨胀的灯箱插件。它专门为图像而构建,因此给出了名称 – 不支持视频或其他媒体类型。它也不需要无关的HTML标记; 的<img>
元件就足够了。该插件正常工作。
- 依赖:jQuery
- 浏览器支持:IE9 +,Chrome,Firefox,Safari和Opera
- 许可证:未定义
迷你灯箱
另一个没有臃肿的灯箱插件。该库只有2kb,仅适用于图像。如果您只指定最新的浏览器并且不需要覆盖其他媒体类型(如视频),那么这是一个完美的插件。
- 依赖性:无
- 浏览器支持:IE10 +,Chrome,Firefox,Safari和Opera
- 许可证:MIT许可证
LightCase
Lightcase是一个可爱的灯箱插件。它带有几个动画,使用户交互活跃,如淡入淡出,弹性缩放和滚动。此外,它还支持各种类型的媒体,包括Youtube嵌入,HTML视频,SWF和输入表单。该插件还可以正确处理无法访问的媒体或发现错误
- 依赖:jQuery
- 浏览器支持:IE9 +,Chrome,Firefox,Safari和Opera
- 许可证:GPL许可证
Yalb
Yalb代表Yet Another Lightbox – 但事实并非如此。Yalb附带了一些API,包括允许您识别灯箱状态的自定义事件,例如何时open
以及何时close
。Yalb有两个版本,Vanilla JavaScript和jQuery插件。
- 依赖性:无
- 浏览器支持:IE9 +,Chrome,Firefox,Safari和Opera
- 许可证:MIT许可证
羽之
该6KB 羽之是精明的开发商裸插件,只携带必需品。例如,如果您需要在图库中对图像灯箱进行分组,则可以包含图库扩展。您还可以为此插件开发自己的扩展,以满足您的项目需求。
- 依赖:jQuery
- 浏览器支持:IE8 +,Chrome,Firefox,Safari和Opera
- 许可证:MIT许可证
LightLayer
LightLayer是一个易于使用的灯箱插件。它有一些选项,自定义JavaScript方法和自定义事件。该插件适用于图像,视频,地图和外部内容。我们还能问什么呢。
- 依赖:jQuery
- 浏览器支持:IE9 +,Chrome,Firefox,Safari和Opera
- 许可证:MIT许可证
LightGallery
LightGallery,另一个添加了许多功能的灯箱插件。它提供了20多种选项来定制灯箱最细微的细节。
- 依赖:jQuery
- 浏览器支持:IE7 +,Chrome,Firefox,Safari,Opera,iOS,Android和Windows Phone
- 许可证:MIT许可证
FluidBox
Fluidbox是一款灵感来自Medium的图像灯箱插件。它适用于各种情况下的图像,包括浮动图像,具有absolute
位置的图像,具有边框和填充的图像以及图库。看看它是如何构建的。如果你需要一个WordPress插件,那就有一个。
- 依赖:jQuery
- 浏览器支持:IE9 +,Chrome,Firefox,Safari,Opera
- 许可证:MIT许可证
StripJS
StripJS是一个独特的灯箱插件。插件不是覆盖图像,而是从侧面滑动图像,这样它就不会阻挡整个内容。StripJS支持图像和视频。
- 依赖:jQuery
- 浏览器支持:IE7 +,Chrome,Firefox,Safari,Opera,iOS 5+和Android 3+
- 许可:Creative Commons BY-NC-ND 3.0许可