qq_疯狂的疯子_0
2015-09-22 15:53
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>baiyechuang</title>
<style type="text/css">
img{
width: 600px;
height: 310px;
}
</style>
</head>
<body>
<img src="1.jpg">
<img src="2.jpg">
<img src="3.jpg">
<img src="4.jpg">
<script type="text/javascript">
window.onload = function (){
var oimg=document.getElementsByTagName('img'),
timer=null;
for(var i=0;i<oimg.length;i++){
function start(target){
var speend=0;
if(target>this.style.width){
speend=1;
}else{
speend=-1;
}
if(this.style.width==target){
clearInterval(timer);
}else{
this.style.width=this.offsetWidth+speend+'px';
}
}
oimg[i].onmouseover=function(){
clearInterval(timer);
timer=setInterval(
start(400);
},30);
}
oimg[i].onmouseout=function(){
clearInterval(timer);
timer=setInterval(
start(310);
},30);
}
}
}
</script>
</body>
</html>
定时器没有你那么写的吧。里面是一个匿名回调函数
oimg[i].onmouseover=function(){
clearInterval(timer);
timer=setInterval(
start(400);
},30);
仔细看,{} 明显的嵌套不对
JS动画效果
113925 学习 · 1443 问题
相似问题