要让谷歌浏览器实现此特效怎么办呢,这个特效我测试了只能用IE打开。

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

AINIforever

2016-11-13 19:48

老师讲的这个方法chrome不支持怎么办,现在很少人用IE的。

写回答 关注

4回答

  • MorningDuGe
    2016-11-14 10:20:29
    已采纳

    怎么会  老师就是用chrome测试的  你粘贴下你的完整代码 我看看

    AINIfo...

    在下面

    2016-11-14 19:43:15

    共 1 条回复 >

  • 慕移动9181930
    2022-03-27 17:35:42

    亲,不是的,是class类名为first的p标签,所以不能加入空格。 extension=php_gd2.dll

  • 慕娘3064969
    2016-11-18 23:25:39

    return getComputedStyle(obj,false);后面少了[attr]

  • AINIforever
    2016-11-14 19:42:16

    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="utf-8">

    <title>5</title>

    <style type="text/css">

    ul li{

    list-style: none;

    }

    ul li{

    width: 200px;

    height: 100px;

    background-color: yellow;

    margin-bottom: 20px;

    border:4px solid #DD5566;

    }

    </style>

    <script type="text/javascript">

    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,400);

    }

    aLi[i].onmouseout = function(){

    startMove(this,200);

    }

    }

    }

    function getStyle(obj,attr){

    if (obj.currentStyle) {

    return obj.currentStyle[attr];

    }

    else{

    return getComputedStyle(obj,false);

    }

    }

    //var timer = null;

    function startMove(obj,iTarget){

    clearInterval(obj.timer);


    obj.timer = setInterval(function(){

    var opg = parseInt(getStyle(obj,'width'));

                   var speed = (iTarget-opg)/8;

                   speed = (speed >0)?Math.ceil(speed):Math.floor(speed);

                   if (opg == iTarget) {

                    clearInterval(obj.timer);

                   }

                   else{

                    obj.style.['width'] = opg+speed+'px';

                   }

    },30)

    }

    </script>

    </head>

    <body>

    <ul>

    <li>

    </li>

    <li>

    </li>

    <li>

    </li>

    </ul>

    </body>

    </html>


JS动画效果

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

113924 学习 · 1443 问题

查看课程

相似问题