大神帮我看一下哪块出错了,非常感谢!!

来源:2-2 JS透明度动画

qq_浮浅_0

2017-09-06 09:15

<!DOCTYPE html>

<html>

<head>

<meta charset="{CHARSET}">

<title>透明度</title>

<style>

body,div{

            margin:0;

            padding:0;

           }

           #div1{

            width:200px;

            height:200px;

            background:red;

            opacity: 0.3;

            filter:alpha(opacity:30);

            }

        </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(iTarget){

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

        clearInterval(timer);

        timer=setInterval(function(){

        var speed=0;

        if(alpha<iTarget){

        speed=10;

        }

        else{

        speed=-10;

        }

        if(alpha==iTarget){

        clearInterval(timer);

        }

        else{

        alpha=alpha+speed;

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

        oDiv.style.opacity=alpha/100;

        }

        },30);

        }

        </script>

</head>

<body>

<div id="div1"></div>

</body>

</html>


写回答 关注

1回答

  • 慕粉191526966
    2017-09-06 11:42:25

    你这个段代码 哪里有问题?试了一下 能正常显示。

    qq_浮浅_...

    之前没保存才不行,现在可以了,谢谢大佬

    2017-09-06 12:52:12

    共 2 条回复 >

JS动画效果

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

113925 学习 · 1443 问题

查看课程

相似问题