自己做的jquery放大镜效果插件，运行提示e没有定义？
0
悬赏园豆：5
[已解决问题]
解决于 2013-03-04 15:32
html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>放大镜效果</title>
<link rel="stylesheet" type="text/css" href="css/myPlugin-base.css" />
<link rel="stylesheet" type="text/css" href="css/shop-base.css" />
</head>
<body>
<div id="zoomPlay">
<div class="zoomPup">
<span class="mark"></span>
<img src="images/zoomPic.jpg" alt="" />
</div>
<div class="zoomDiv">
<div class="big"><img src="images/zoomBPic.jpg" alt="" /></div>
</div>
</div>
</body>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/zoomPlay.js"></script>
<script type="text/javascript">
$('#zoomPlay').bk_zoom({onPlay:true});
</script>
</html>
js：
$(function(){
$.fn.bk_zoom=function(option){
var elm=$(this);
var mouseX = 0, //鼠标移动的位置X
mouseY = 0, //鼠标移动的位置Y
maxLeft = 0, //最右边
maxTop = 0, //最下边
markLeft = 0, //放大镜移动的左部距离
markTop = 0, //放大镜移动的顶部距离
perX = 0, //移动的X百分比
perY = 0, //移动的Y百分比
bigLeft = 0, //大图要移动left的距离
bigTop = 0; //大图要移动top的距离
defaults={
onPlay:false
}
opt=$.extend(defaults,option);
var zoomOnce={
init:function(){
if (opt.onPlay) {
zoomOnce.imgMouseMove(e);
}
},
//鼠标小图上移动时
imgMouseMove:function(e){
alert(e.type);
var $mark = elm.children(".mark");
//鼠标在小图的位置
mouseX = e.pageX-elm.offset().left - $mark.outerWidth()/2;
mouseY = e.pageY-elm.offset().top - $mark.outerHeight()/2;
//最大值
maxLeft =elm.width()- $mark.outerWidth();
maxTop =elm.height()- $mark.outerHeight();
markLeft = mouseX;
markTop = mouseY;
updataMark($mark);
updataBig();
},
//改变放大镜的位置
updataMark:function($mark){
//通过判断，让小框只能在小图区域中移动
if(markLeft<0){
markLeft = 0;
}else if(markLeft>maxLeft){
markLeft = maxLeft;
}
if(markTop<0){
markTop = 0;
}else if(markTop>maxTop){
markTop = maxTop;
}
//获取放大镜的移动比例，即这个小框在区域中移动的比例
perX = markLeft/$(".zoomPup").outerWidth();
perY = markTop/$(".zoomPup").outerHeight();
alert(perY);
bigLeft = -perX*$(".zoomDiv .big").outerWidth();
bigTop = -perY*$(".zoomDiv .big").outerHeight();
//设定小框的位置
$mark.css({"left":markLeft,"top":markTop,"display":"block"});
},
//改变大图的位置
updataBig:function(){
$(".zoomDiv .big").css({"display":"block","left":bigLeft,"top":bigTop});
},
//鼠标移出时
cancle:function(){
$(".zoomDiv .big").css({"display":"none"});
$(".mark").css({"display":"none"});
}
}
zoomOnce.init();
}
});
自己写的但不知道哪儿错了，运行不了？请大家帮帮看看
最佳答案
1
if (opt.onPlay) {
zoomOnce.imgMouseMove(e);
}
这个e没有定义啊
收获园豆：5
e没有定义，怎么改代码可以正常运行？
@wanglan:
if (!!event && opt.onPlay) {
zoomOnce.imgMouseMove(event);
}
@飞来飞去: 因为你触发事件的时候还没有event,所以不能执行啊
