为什么 只有一个属性好使
大酒神之戟
2016-06-23 15:26
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="css/master.css">
</head>
<body>
<script>
window.onload=function(){
var ali = document.getElementsByTagName("li");
for(var i= 0;i<ali.length;i++){
ali[i].timer=null
ali[i].onmouseover=function(){
startMove(this,'height',400);
}
ali[i].onmouseout=function(){
startMove(this,'height',100);
}
ali[i].onmouseover=function(){
startMove(this,'width',400);
}
ali[i].onmouseout=function(){
startMove(this,'width',200);
}
}
}
// var timer = null
function startMove(obj,attr,iTarget){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var icor = parseInt(getStyle(obj,attr));
var speed =(iTarget-icor)/8
speed=speed>0?Math.ceil(speed):Math.floor(speed)
if(icor==iTarget){
clearInterval(obj.timer);
}else{
obj.style[attr]=icor+speed+"px";
// obj.style.fontSize=parseInt(getStyle(obj,"fontSize"))+speed+"px";
}
},30)
}
function getStyle(obj,attr){
if(obj.currentsyle){
return obj.currentsyle[attr]; //针对ie浏览器
}else{
return getComputedStyle(obj,false)[attr]; //针对firefox浏览器
}
}
</script>
<script>
</script>
<ul>
<li>1111111</li>
<!--
<li>11111</li>
<li>11111</li>
-->
</ul>
</body>
</html>
2回答
-
- 盛夏孤星
- 2016-06-28 16:40:54
ali[i].onmouseover=function(){
startMove(this,'height',400);
}
和
ali[i].onmouseover=function(){
startMove(this,'width',400);
}
是同一个对象，它只能按顺序执行，不能同时执行，因此忽略了width
-
- 雷蛇
- 2016-06-23 15:46:03
var ali = document.getElementsByTagName("li") 因为你获取了一个变量属性，
JS动画效果
113925 学习 · 1443 问题
相似问题