为了账号安全,请及时绑定邮箱和手机立即绑定

为什么鼠标移开时没反应呢

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>透明度动画</title>

<style type="text/css">

    body,div{padding:0;margin:0;}

    #div1{

      width: 200px;height: 200px;background: red;filter:alpha(opacity:30);opacity: 0.3;

    }

</style>

<script>

    window.onload=function(){

        var odiv=document.getElementById('div1');

        odiv.onmouseover=function(){

            startmove(100);

        }

        odiv.onmouseout=function(){

            startmove(30);

        }

    }

    var timer=null;

    var alpha=30;

    function startmove(itaget){

        clearInterval('timer');

       var odiv=document.getElementById('div1');

       timer=setInterval(function(){

        var speed=0;

        if(alpha>itaget)

            {speed=-10;}

        else

            {speed=10;}

        if(alpha==itaget)

            {clearInterval('timer');}

        else

            {alpha+=speed;

            odiv.style.filter='alpha(opacity:'+alpha+')';

            odiv.style.opacity=alpha/100;

        }

       },30)

    }



</script>

<meta name="description" content="">

<meta name="keywords" content="">

<link href="" rel="stylesheet">

</head>

<body>

    <div id="div1">

        

    </div>

</body>

</html>


正在回答

1 回答

clearInterval(timer);

这个得这么写哦。。太不认真看了。

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
JS动画效果
  • 参与学习       113923    人
  • 解答问题       1443    个

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

进入课程

为什么鼠标移开时没反应呢

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信