jQuery-实现图片的放大镜显示效果
jQuery-实现图片的放大镜显示效果
by zhangxinxu from http://www.zhangxinxu.com
本文地址：http://www.zhangxinxu.com/wordpress/?p=85
网上购物日趋流行，商品的图片很重要，一个页面上信息量很大，商品图片必然大小有限，很流行的做法是鼠标移动到图片上，图片放大显示，例如：淘宝。
然而，这里只是单纯的放大，如果能够实现移动放大，局部放大，那么效果会更上一层楼。这里，即将展示的就是类似于放大镜效果的图片局部放大效果。
先看效果截图：
点击进入：效果演示页面（含文件打包下载）
使用的固定模式是a标签里面嵌套img标签，a标签href指向放大的图片路径。要想哪张图片放大镜显示，就直接调用哪张图片。例如：
jQuery.noConflict();
jQuery(document).ready(function(){
$(“img.zxx_zoom_image”).jqueryzoom();
});
表示class为zxx_zoom_image的img将调用图片放大的js函数，如果其父标签为a标签，且href指向一个大图地址，则即可实现图片的放大镜效果。
原创文章，转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]
本文地址：http://www.zhangxinxu.com/wordpress/?p=85
转自：http://www.zhangxinxu.com/wordpress/2009/08/jquery-%E5%AE%9E%E7%8E%B0%E5%9B%BE%E7%89%87%E7%9A%84%E6%94%BE%E5%A4%A7%E9%95%9C%E6%98%BE%E7%A4%BA%E6%95%88%E6%9E%9C/
