jQuery插件:图片放大镜--jQuery Zoom_magento_百度空间企业库|免费b2b网站

jQuery插件:图片放大镜--jQuery Zoom_magento_百度空间

这是一款非常不错的给图片添加放大镜效果,可以应用在诸如zen cart,magento电子商场之类的开源项目上.如果想看它的效果,你可以直接访问:

觉得不错就下载一个玩玩吧,jQuery出来的插件都是非常容易使用的,也可以当做学习的示例.

如何安装:

先在网页中包含jQuery文件,然后再包含jQZoom的文件,如下:

然后再将jqzoom.css添加到网页中:

<link rel="stylesheet" type="text/css" href="css/jqzoom.css" />

如何使用?

Using jQZoom is easy,but you need to specify the HTML anchor element,that is going to generate the zoom revealing a portion of the enlarged image.

使用是很简单的,先指定一个<a>标签,指向一个大的图片,里面包含一个小图片:
<a href="images/BIGIMAGE.JPG" class="MYCLASS"  title="MYTITLE">
<img src="images/SMALLIMAGE.JPG" title="IMAGE TITLE"  >
</a>

SMALLIMAGE.JPG:这个是默认用户看见的图片,也就是之后被放大的图片

BIGIMAGE.JPG: 放大镜所看到的图片
MYCLASS: Represents the anchor class,that would be used to instantiate the jQZoom script to all the elements matching this class(you can use an ID as well).用来标识这个<a>标签要应用放大镜功能.之后我们可以通过class选择器来选择所有的要应用jQZoom的<a>标签.

MYTITLE/IMAGE TITLE: 这些文本它们会被显示在放大镜窗口上.

准备工作做完了就可以通过下面的简单代码来调用jQZoom:

郑重声明：资讯【jQuery插件:图片放大镜--jQuery Zoom_magento_百度空间】由发布，版权归原作者及其所在单位，其原创性以及文中陈述文字和内容未经(企业库qiyeku.com)证实，请读者仅作参考，并请自行核实相关内容。若本文有侵犯到您的版权，请你提供相关证明及申请并与我们联系（qiyeku # qq.com）或【在线投诉】，我们审核后将会尽快处理。

—— 相关资讯 ——