用框架模仿淘宝的图片放大镜显示效果

如图

今天我做的是利用框架模拟这个效果源码如下复制代码代码如下：头脚本类型=' text/JAVAScript ' src=' http : js/jquery-1。4 .1 .js /脚本脚本类型='text/javascript' //假设数据是从数据库取到的数据var数据={ ' images/1 _ small。jpg ' :[' images/1 _ big。jpg '，'内衣少女','主演：文咏珊，郑丽欣]，' images/2 _ small。jpg ' :[' images/2 _ big。jpg '，'爱情陷阱','主演：金正勋，蔡琳]，' images/3 _ small。jpg ' :[' images/3 _ big。jpg '，'源代码','主演：贾斯丁，克里斯丁娜']};$(function(){ $).每个（数据、函数（键、值){ var small img=$(' img src=' key ')；smallimg.attr('bigmappath '，值[0]);小型img。attr('个人姓名'，值[1]);smallimg.attr('personheight '，值[2]);smallimg.mouseover(函数(e){ $('#detailImg ').attr('src '，$(this).attr(' big map path ')；$('#detailHeight ').文本($(这个).attr('人高')；$('#detailName ').文本($(这个).attr('个人姓名')；$(“# details”).css('top '，e.pageY).css('left '，e.pageX).css('display '，' ')；});$(“正文”).追加(小型img)；});});/script/head body div style=' display : none；position : absolute ' id=' details ' img id=' detailImg ' src=' http : ' p id=' detailHeight '/p p id=' detailName '/p/div/body鼠标移动到小图上面效果图如下