搞不懂哪里错了。。。-慕课网

首页课程实战体系课手记专栏慕课教程

搞不懂哪里错了。。。

来源：4-2 获取样式

TAMJING

2015-07-29 11:40

help~

写回答关注

3回答

Code_M0keny

2015-07-29 13:52:12

已采纳
注意看line38
```
icur = Math.round(parseFloat(getStyle(obj.attr))*100);
```
obj.attr
目测是你这个参数搞错了。应该是传递的两个参数
所以应该是
```
icur = Math.round(parseFloat(getStyle(obj, attr))*100);
```
1 1

TAMJIN...

哈哈哈，后来我也发现，THX~

2015-07-29 13:56:19

共 1 条回复 >

TAMJING: 2015-07-29 13:34:02

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自主封装多功能动画框架</title>
    <style>
 ul li{
            width: 300px;;
            height: 200px;
            background: pink;
            opacity: 0.3;
        }
    </style>
    <script>
 window.onload = function(){
            // test
 var Li1 = document.getElementById('li1');
            Li1.onmousemove = function(){
                DIY_Animation(this,'opacity',100);
            }
            Li1.onmouseout = function(){
                DIY_Animation(this,'opacity',30);
            }
        }
        //获取对象obj的attr属性
 function getStyle(obj,attr){
            if(obj.currentStyle){  return obj.currentStyle[attr];}// 有错！
 else{  return getComputedStyle(obj,false)[attr];}
        }
        //可以改变宽高、背景属性、字号属性、边框属性等等
        //透明度(opacity)特殊处理，0~100为标准
//        var alpha=30;
 function DIY_Animation(obj,attr,iTarget){ //obj=对象;attr=属性;iTarget=改变的数值
 clearInterval(obj.timer);
            obj.timer = setInterval(function(){
                var icur = 0;
                if(attr == 'opacity'){
                    icur = Math.round(parseFloat(getStyle(obj.attr))*100);
                }else{  icur = parseInt(getStyle(obj,attr));}
                //获取对象obj的attr属性,parseInt()取整
 var speed = (iTarget-icur)/8;
                speed = speed>0?Math.ceil(speed):Math.floor(speed);
                if(icur == iTarget){  clearInterval(obj.timer);}
                else {
                    if (attr == '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>

0 0

Code_M0keny

2015-07-29 13:27:29

请帖完整代码

3 0

Code_M... 回复TAMJIN...

是的。我刚回复你就找到了。不错不错

2015-07-29 13:56:49

共 3 条回复 >

JS动画效果

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

113925 学习 · 1443 问题

查看课程

相似问题

搞不懂错在哪里。。报错是21行 cannot set property“onmouseover”of null...

回答 1

搞不懂啊求教

回答 2

不知道哪里错了，动不了~

回答 5

搞不懂为什么，帮帮忙

回答 1

哪里错了？

回答 1

打开慕课网App查看更多内容