Lightbox/弹窗

放大镜效果jQuery LightBox图片画廊插件

阿里云

zbox 是一款带放大镜效果的 jQuery LightBox 图片画廊插件。该 Lightbox 插件可以显示相应缩略图的高清大图,并且在浏览高清大图时还可以使用放大镜来局部查看放大效果。

使用方法:

使用该 LightBox 插件需要引入 jQuery 和 jquery.zbox.css,以及 jquery.zbox.js 文件

也想出现在这里?联系我们
创客主机
  1. <link type="text/css" rel="stylesheet" href="css/jquery.zbox.css" />               
  2. <script src="js/jquery.min.js"></script>
  3. <script src="js/jquery.zbox.js"></script>

HTML 结构:

该 LightBox 插件的基本 HTML 结构使用一个超链接来包裹一个图片元素,超链接指向高清大图。

  1. <a class="zb" rel="group" href="1.png" title="Image 1">
  2.   <!--缩略图-->
  3.   <img src="1_thumb.png">
  4. </a>
  5.  
  6. <a class="zb" rel="group" href="2.png" title="Image 2">
  7.   <!--缩略图-->
  8.   <img src="2_thumb.png">
  9. </a>
  10.  
  11. <a class="zb" rel="group" href="3.png" title="Image 3">
  12.   <!--缩略图-->
  13.   <img src="thumb3.png">
  14. </a>

在页面加载完毕之后,可以通过下面的方法来初始化该 LightBox 插件。

  1. $(".zb").zbox();

zbox 插件的 github 地址为:https://github.com/statenlogic/zbox

放大镜效果 jQuery LightBox 图片画廊插件

已有 444 人购买
查看演示升级 VIP立刻购买

演示地址 下载地址
收藏
(0)

发表回复

热销模板

Ashade - 作品展示摄影相册WordPress汉化主题
LensNews

本站承接 WordPress / PbootCMS / DedeCMS 等
系统建站、仿站、开发、定制等业务!