zoukankan      html  css  js  c++  java
  • 窗口浮动

    JS浮动窗口(随浏览器滚动而滚动)
    2010-08-31 09:34

    往往用于一些联系方式,互动平台模块,随着浏览器的滚动而滚动。

      

    <div id="AdLayer">

    <p>窗口中的内容</p>

    </div>

       

    <!--#include file="fly.asp" -->放在<body>下面(页面最上面)

        

    JS代码

    window.onload=function(){

    var n=0; //top

    var obj=document.getElementById("AdLayer"); //position:fixed对象

    if(document.body.scrollTop)

    {

    window.onscroll=function(){obj.style.top=(document.body.scrollTop)+n+'px';}

    window.onresize=function(){obj.style.top=(document.body.scrollTop)+n+'px';}

     }

    else

    {  

    document.documentElement.onscroll=function(){obj.style.top=(document.body.scrollTop||document.documentElement.scrollTop)+n+'px';}

    document.documentElement.onresize=function(){obj.style.top=(document.body.scrollTop||document.documentElement.scrollTop)+n+'px';}

    }

    }

       

    CSS代码:

    #AdLayer { background:url(../images/gj_3.jpg) no-repeat top center; 

    right:0; top:0; 80px; height:235px; position:absolute; padding-right:10px; padding-top:75px; text-align:center; margin-top:150px;}

       

    CSS代码分析,背景图片,大小宽80,高235,浮动,靠右上,窗口的内容居中,与上的距离为75,窗口跟上的距离为150,当然,,代码可随你自己的意,

    阅读全文
    类别:默认分类 查看评论
  • 相关阅读:
    在 docker 容器中捕获信号
    python入门二维码生成
    SSH 端口转发
    Python之模块与包
    滑块验证demo示例
    上下界网络流初探
    大整数模板
    计算几何模板
    关于差分约束系统的脑洞
    并查集,以及可拆分并查集
  • 原文地址:https://www.cnblogs.com/xlhblogs/p/2071883.html
Copyright © 2011-2022 走看看