js运动-淡入淡出

来源:互联网 发布:mac照片图库照片路径 编辑:程序博客网 时间:2024/06/05 20:48
        <style>            #div1{width: 140px; height: 140px; background: url(http://img06.tooopen.com/images/20170321/tooopen_sl_202648839562.jpg);margin: 50px auto;            alpha(opacity:30); opacity: 0.3;}         </style>        <script>            window.onload=function ()            {                var oDiv=document.getElementById('div1');                   var alpha=30;                var timer=null;                var speed=5;                oDiv.onmouseover=function()                {                    moveStar(100);                };                oDiv.onmouseout=function()                {                       moveStar(30);                };                function moveStar(iTaget)                {                       clearInterval(timer);                    timer=window.setInterval(function (){                        speed=iTaget>alpha?10:-10;                        if(iTaget==alpha)                        {                            clearInterval(timer);                        }                        else                        {                            alpha+=speed;                        }                        oDiv.style.filter='alpha(opacity:'+alpha+')';                        oDiv.style.opacity=alpha/100;                    },30);                };            }        </script>    </head>    <body>        <div id="div1">        </div>    </body></html>
0 0
原创粉丝点击