zoukankan      html  css  js  c++  java
  • javascript 我是广告

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>我是广告</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link href="" rel="stylesheet">

    </head>
    <body>
    <div id="one" style="background:green;position:absolute;left:0;top:0;100px;height:100px;">我是广告我怕谁</div>
    </body>

    <script>
        
        var x=0;
        var y=0;

        var xs=10;
        var ys=10;

        var one=document.getElementById("one");
        function move()
        {
                x+=xs;
                y+=ys;
                if(x >= document.body.clientWidth-one.offsetWidth-20|| x <=0 ){
                    xs=-1*xs;
                }
                //这里注意document.body.clientHeight是html 跟  document.documentElement.clientHeight是xml html5  的区别
                if(y >= document.documentElement.clientHeight-one.offsetHeight-20 || y <=0)
                {
                    ys=-1*ys;
                }
                one.style.left=x+"px";
                one.style.top=y+"px";    
        }
        
        var dt=setInterval("move()",100);
        one.onmouseover=function()
        {
            clearInterval(dt);
        }

        one.onmouseout=function()
        {
            dt=setInterval("move()", 100);    
        }

    </script>

    </html>
  • 相关阅读:
    字符串实现变量映射
    纯css实现无限嵌套菜单
    flex布局嵌套之高度自适应
    easy ui 零散技巧
    js高级应用
    前端利器
    css高级应用及问题记录(持续更新)
    兼容性验证方案
    原生js判断元素是否可见
    vue-cli webpack躺坑之旅
  • 原文地址:https://www.cnblogs.com/hnbiao/p/4666248.html
Copyright © 2011-2022 走看看