有几个 优秀的开源 JavaScript 轻量级灯箱(Lightbox)库,并且大多数是 免费开源 的,适用于个人和商业用途。
1. Lightbox2
- GitHub: lightbox2
- 许可证: MIT(免费开源,可商用)
- 特点:
- 轻量级,易于集成。
- 支持图片缩放、键盘导航、预加载等。
- 使用简单的 HTML
data-lightbox
属性即可启用。
2. GLightbox
- GitHub: glightbox
- 许可证: MIT(免费开源,可商用)
- 特点:
- 支持图片、视频(YouTube/Vimeo)和 HTML 内容。
- 现代动画效果,基于 CSS3 和 JS。
- 适配 移动端触摸手势。
3. baguetteBox.js
- GitHub: baguetteBox.js
- 许可证: MIT(免费开源,可商用)
- 特点:
- 无依赖,比 Fancybox 更轻量。
- 支持响应式,适用于移动端和 PC。
- 代码简洁,仅需几行 JavaScript 即可集成。
4. PhotoSwipe
- GitHub: photoswipe
- 许可证: MIT(免费开源,可商用)
- 特点:
- 极致流畅的滑动交互体验,适用于移动端。
- 动态加载,可用于大规模图片库。
- 高度可定制,支持插件扩展。
5. Lity
- GitHub: lity
- 许可证: MIT(免费开源,可商用)
- 特点:
- 超轻量(仅 3KB minified),适合极简项目。
- 支持 图片、视频(YouTube/Vimeo)、HTML 内容。
- 无 jQuery 依赖,原生 JavaScript 运行。
总结(推荐)
名称 | 许可证 | 依赖 | 适用场景 | 主要特点 |
---|---|---|---|---|
Lightbox2 | MIT | 依赖 jQuery | 图片展示 | 经典款,简单易用 |
GLightbox | MIT | 无依赖 | 图片 & 视频 | 轻量、现代动画效果 |
baguetteBox.js | MIT | 无依赖 | 轻量级项目 | 超轻量,适配移动端 |
PhotoSwipe | MIT | 无依赖 | 大规模图库 | 高级滑动交互,移动端优化 |
Lity | MIT | 无依赖 | 图片 & 视频 & HTML | 轻量、快速加载 |
推荐选择
- 如果你想找一个简单易用的开源替代方案 → Lightbox2
- 如果你需要支持视频、动画效果好 → GLightbox / Lity
- 如果你需要轻量级、无依赖 → baguetteBox.js
- 如果你有大量图片 & 需要良好的移动端体验 → PhotoSwipe