JQuery常用插件大全(1): Lightbox JS
的有关信息介绍如下:Lightbox JS 是一个简单而又谦恭的用来把图片覆盖在当前页面上的脚本.就是一个页面上的弹出式对话框的组件, 它能被快速安装并且运作于所有流行的浏览器.而 JQuery Lightbox 是在 jQuery 框架的基础上实现版本。
本经验分享使用Lightbox JS
在百度搜索中搜索关键词"Lightbox JS",如下图所示。
访问Lightbox官方网站,Download the latest version(下载Lightbox最新版本),如下图所示。
Include the CSS at the top of your page in your
tag:(引入CSS文件再页面的头部
Include the Javascript at the bottom of your page before the closing tag:
引入Javascript文件再页面的底部在body标签关闭之前,如下所示。
DOM 结构
以上内容设置好即可,会自动调用 Lightbox。
使用说明,如下图所示。
参数说明
注意:目前除了修改源码,不能在调用的时候修改参数(因为是自动调用的,并且参数没有暴露到外部),期待以后的更新能完善该功能。
新建HTML文件,如下图所示。
Two Individual Images
A Four Image Set
For more information, visit http://lokeshdhakar.com/projects/lightbox2/
jQuery Lightbox2 灯箱效果,如下图所示。