js原生代码实现漂浮广告

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title> New Document </title>
        <meta name="Generator" content="EditPlus">
        <meta name="Author" content="">
        <meta name="Keywords" content="">
        <meta name="Description" content="">
        <style type="text/css">
            .delete{

                background: unset;
            }
        </style>
        <script type="text/javascript">
            window.onload=function(){
                //定时器
                var oneInner=document.getElementById("FlyDiv");

                var a1a = setInterval(moves,500);
                //函数
                var x = 10;
                var y = 10;

                function moves(){
                    var tops = oneInner.offsetTop
                    var lefts = oneInner.offsetLeft

                    if (lefts>=document.documentElement.clientWidth-oneInner.offsetWidth||lefts<=0)
                    {
                        x=-x
                    }

                    if (tops>=document.documentElement.clientHeight-oneInner.offsetHeight||tops<=0)
                    {
                        y=-y
                    }

                    tops+=y;
                    lefts+=x;

                    oneInner.style.top=tops+"px"
                    oneInner.style.left=lefts+"px"
                }

                //悬停停止
                oneInner.onmouseover=function(){
                    clearInterval(a1a);
                }
                //放手继续运动
                oneInner.onmouseout=function(){
                    a1a =setInterval(moves,400);
                }
                //删除
                function close(){
                    document.body.removeChild(oneInner);
                }
            }
        </script>

    </head>

    <body>
<div style="background:#663398;position:absolute;width:200px;height:100px;border:solid 3px #2F74A7;cursor:pointer;"  id="FlyDiv">
    <span onclick="close()" style="background: white">
    ssssssssssssssssss
</span>
</div>

    </body>
</html>
js原生代码实现漂浮广告

Comments
