zoukankan      html  css  js  c++  java
  • 广告图片随滚动条移动

    在我们经常浏览一些网站的时候,经常会看到广告,注意到广告随着滚动条而滚动,下面解密;

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    
    <body>
       <!--淘宝网图片-->
    <div style="993px;height:1799px; margin:0 auto"><img src="contentpic.jpg" width="993" height="1799" />
    </div>
    
    
    
    <div id="s1" onclick="clos()">
    
     
         <!--广告图片-->
    
        <img id="img" src="advpic.jpg" width="117" height="150" style="top:30px;left:50px;position:absolute;z-inder:10" >
         <!--关闭广告图片-->
       <img src="close.jpg" width="13" height="13" style="top:30px;left:60px;float:left;position:absolute;z-inder:10"/> 
    </div>
    </body>
    <script type="text/javascript">
    
    //获取图片id
          var scoreimg=document.getElementById("img");
        //得到top的具体位置
        var top=parseInt(scoreimg.style.top);
        //得到left的具体位置
        var left=parseInt(scoreimg.style.left);
    
        
    function move(){
        
        scoreimg.style.top=top+parseInt(document.documentElement.scrollTop)+"px";
        
        scoreimg.style.left=left+parseInt(document.documentElement.scrollLeft)+"px";
            
        
    
    
    }
    
    onscroll=move; 
    //定义关闭广告窗口
    function clos(){
         var ok= document.getElementById("s1");
           ok.style.display="none";
        
    }
    </script>
    </html>

  • 相关阅读:
    compareTo冒泡比较时间字符串
    RestTemplate
    poi 处理空单元格
    Linux执行Java文件
    cmd 运行 java 文件
    @RequestParam 引发的编译问题
    linux 下安装与使用
    ajax请求 Provisional headers are show
    JWT加密
    Web API Filter
  • 原文地址:https://www.cnblogs.com/wlx520/p/4500285.html
Copyright © 2011-2022 走看看