码迷,mamicode.com
首页 > Web开发 > 详细

jquery放大镜

时间:2016-06-02 11:06:44      阅读:186      评论:0      收藏:0      [点我收藏+]

标签:

<li><a><img alt="XXX" src="图片路径" /></a></li>
<li><a><img alt="XXX" src="图片路径" /></a></li>

show.js
//Jquery实现过程
xOffset = 10; 
yOffset = 30; 
jQuery("#imglist").find("img").hover(function(e) { 
    jQuery("<img id=‘imgshow‘ src=‘" + this.src + "‘ />").appendTo("body"); 
    jQuery("#imgshow") 
        .css("top", (e.pageY - xOffset) + "px") 
     .css("left", (e.pageX + yOffset) + "px") 
        .fadeIn("fast"); 
}, function() { 
    jQuery("#imgshow").remove(); 
});
//鼠标移动
jQuery("#imglist").find("img").mousemove(function(e) { 
    jQuery("#imgshow") 
       .css("top", (e.pageY - xOffset) + "px") 
       .css("left", (e.pageX + yOffset) + "px") 
});
 

jquery放大镜

标签:

原文地址:http://www.cnblogs.com/maz9666/p/5551925.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!