首页 > 网页特效 > 图片特效 > 效果很棒的jQuery图片放大镜特效

效果很棒的jQuery图片放大镜特效

时间：2010-04-22 来源：互联网

Image Power Zoomer是一款效果很棒的基于jQuery图片放大镜特效，鼠标在图片移动时即显示一个放大的图片局部，还可以根据需要用鼠标滚轮调整放大倍数。代码调用简单，只需要二个JS文件，图片只需加上一个class类即可。

1.在<head>区的代码

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="ddpowerzoomer.js"></script>
<script type="text/javascript">
jQuery(document).ready(function($){ //fire on DOM ready
 $('img#gallerya').addpowerzoom({magnifiersize:[100,100]})
 $('img.gallery').addpowerzoom({powerrange:[2,5]})
})
</script>

2.在<body>区图片代码示例

<img class="gallery" border="0" src="budapest.jpg" style="width:339px;height:225px">

图片只需要加入class="gallery "类即可。

更多帮助见官网：http://www.dynamicdrive.com/dynamicindex4/powerzoomer.htm

相关热词：放大镜 jQuery

分享到：

更多...

收藏至我的帐号

本地下载

下载排行榜: 31款简单实用的CSS+JS下拉菜单脚本; 带标题和数字导航的JS焦点幻灯特效代码; 半透明立体质感的宽屏flash+xml焦点幻灯代码; 简洁效果多图切换flash幻灯焦点图代码; 适合摄影网站超漂亮的宽屏flash+xml幻灯轮换代码; 透明质感上下滑动带小图预览5屏JS焦点图幻...; 唯美华丽带缩略小图的滑动式JQuery幻灯片特...; 14款很漂亮的jQuery导航菜单插件; 3D立体效果金字塔环形旋转的flash+xml相册代码; 带标题显示的宽屏jQuery焦点幻灯片代码

教程排行榜: 21个可用于网站和博客的免费视频播放器插件; 10个WEB开发者应该收藏的实用工具网站推荐; 20款国外知名的PHP开源免费CMS系统推荐; 10款有利于加速WEB开发的必备CSS开发框架; 国外十五款优秀的免费开源电子商务平台; 新浪SAE新手教程：如何下载和安装DiscuzX2.0？; 微博数据分析：新浪微博企业微博发布时间规...; 12款跨浏览器的网页兼容性测试工具推荐; 国外五款主流的免费网站流量统计工具; 巧用QQ漂流瓶做网站营销推广