求大神帮忙看看为什么没效果

来源:4-4 任意属性值(二)

z921129H

2016-04-13 12:25

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<style>

*{margin:0; padding:0}

ul li{width:200px; height:100px; background:yellow; margin-bottom:10px; border:4px solid #000; filter:alpha(opacity=30); opacity:0.3}

</style>

<script>

window.onload=function(){

var li1=document.getElementById("li1")

li1.onmouseover=function(){

Move(this,"opacity",100);}

li1.onmouseout=function(){

Move(this,"opacity",30);}

}

function getStyle(obj,attr){

 if(obj.currentStyle){

     return obj.currentStyle[attr];

 }

else{

    return getComputedStyle(obj,false)[attr];

}

}

function Move(obj,attr,target){

clearInterval(obj.time)

obj.time=setInterval(function(){

var icur=0;

if(icur=="opacity"){

icur=Math.round(parseFloat(getStyle(obj,attr))*100)

}

else{

   icur=parseInt(getStyle(obj,attr))

}

var speed=(target-icur)/8

speed=speed<0?Math.floor(speed):Math.ceil(speed)

if(icur==target){

clearInterval(obj.time)}

else{

if(icur=="opacity"){

 

obj.style.filter="alpha(opacity:"+(icur+speed)+")"

obj.style.opacity=(icur+speed)/100;

}

else{

obj.style[attr]=icur+speed+"px"}}

},30)

}


</script>

</head>


<body>

<ul>

<li id="li1"></li>

</ul>

</body>

</html>


写回答 关注

1回答

  • QQ25
    2016-04-13 15:12:41
    已采纳

    http://img.mukewang.com/570df1500001090603230139.jpg

    icur改为attr

    z92112...

    恩恩,谢啦

    2016-04-13 20:16:50

    共 1 条回复 >

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113925 学习 · 1443 问题

查看课程

相似问题