为什么一定要用函数mav(),不知道用的原理 但是不用,划过就一下就过去了
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/css.css">
<script type="text/javascript" src="js/js.js"></script>
</head>
<body>
<div id="container">
<img src="images/door1.png" alt="">
<img src="images/door2.png" alt="">
<img src="images/door3.png" alt="">
<img src="images/door4.png" alt="">
</div>
</body>
</html>
js部分:
window.onload=function(){
var box=document.getElementById('container');
var imgs=box.getElementsByTagName('img');
var imgWidth=imgs[0].offsetWidth;
var exposWidth=160;
var boxWidth=imgWidth+(imgs.length-1)*exposWidth;
box.style.width=boxWidth+'px';
function setimg(){
for(var i=1;i<imgs.length;i++){
imgs[i].style.left=imgWidth+exposWidth*(i-1)+'px';
}
}
setimg();
var transWidth=imgWidth-exposWidth;
for(var i=0;i<imgs.length;i++){
function mav(i){
imgs[i].onmouseover=function(){
setimg();
for(var j=1;j<=i;j++){
imgs[j].style.left=parseInt(imgs[j].style.left,10)-transWidth+'px';
}
}
};
mav(i);
}
};