Smoothbox 是一款非常实用的超酷 jQuery 轻量级响应式 lightbox 插件。该 lightbox 插件在图片转换时带有平滑的 CSS3 过渡效果。如果不使用 CSS3 过渡效果,该插件可以支持到 IE8 浏览器。它的特点有:
轻量级[1.7Kb]
预加载图片
可以在多个项之间建立画廊
实用 CSS3 transitions 制作平滑过渡效果
响应式图片设置
支持 Chrome, Safari, Firefox (16+), Internet Explorer (9+)浏览器
如果不使用 CSS3 transitions 还可以支持 Explorer 8, Firefox (-16)浏览器
不支持 Internet Explorer 7 及以下的 IE 浏览器
实用该 lightbox 插件首先要引入 jQuery、smoothbox.js 和 smoothbox.css 文件。
<link rel="stylesheet" href="css/smoothbox.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/smoothbox.js"></script>
然后在你需要触发 lightbox 效果的超链接上添加 class sb 即可。
<a class="sb" href="images/1.jpg" title="Hey here's a caption">Image One</a>
如果想要实用标题效果,为图片添加 title 首先即可。该 lightbox 插件没有任何 js 参数,你可以通过修改 CSS 的样式来自定义 lightbox 的外观。
演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务,详询在线客服!