JS浮动窗口（随浏览器滚动而滚动）

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

<div id="AdLayer">

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

</div>

放在<body>下面（页面最上面）

JS代码

window.onload=function(){

var n=0;//top值

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

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

window.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; width:80px; height:235px; position:absolute; padding-right:10px;padding-top:75px; text-align:center;margin-top:150px;}

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

(转)JS浮动窗口（随浏览器滚动而滚动）的更多相关文章

  1. JS获取页面,元素,窗口和返回页面,元素,窗口的宽高以及滚动值

    jquery获取页面,元素,窗口的宽高以及滚动值 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window) ...

  2. 【js】右下角浮动窗口

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. js event 事件兼容浏览器 ie不需要 event参数 firefox 需要

    js event 事件兼容浏览器    ie不需要 event参数   firefox 需要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

  4. js实现图片向上播放（轮番滚动）

    js实现图片向上播放(轮番滚动) 实现方式,多种多样,这里我们来看javascript实现方式,重点是研究里面的源代码: 看看别人是如何写出“优雅的代码” <!DOCTYPE html PUBL ...

  5. js获取滚动条距离浏览器顶部,底部的高度,兼容ie和firefox

    做web开发经常会碰到需要获取浏览器的滚动条与顶部和底部的距离,然后做相应的处理动作.下面作者就如何通过js来获取浏览器滚动条距离浏览器顶部和底部的高度做一下分享,这个是同时兼容ie和firefox的 ...

  6. JS关闭窗口或JS关闭页面的几种代码

    //JS定时自动关闭窗口 <script language="javascript"> <!-- function closewin(){ self.opener ...

  7. Extjs学习----------动态载入js文件（减轻浏览器的压力）

    动态载入js文件能够减轻浏览器的压力,本例使用了Ext.window.Window组件,该组件的学习地址:http://blog.csdn.net/z1137730824/article/detail ...

  8. Jquery 类似新浪微博，鼠标移到头像，用浮动窗口显示用户信息，已做成一个jquery插件

    请注意!!!!! 该插件demo PHP 的 demo下载  C#.NET的demo下载 需要如下图, 1.鼠标移动到头像DIV时,Ajax获取数据,并让浮动DIV显示出来. 2.鼠标可以移动到上面浮 ...

  9. 【Javascript】JS的异步操作，浏览器的多线程间的协作

    遇到的问题,引发了思考 今天看了一个例子,强烈引发了我对于浏览器多线程之间的操作机制.同步与异步.回调函数的兴致,代码如下: <html> <head> <title&g ...

随机推荐

  1. linux笔记：搜索命令find,locate,which,whereis,grep

    命令名称:find功能:文件搜索命令所在路径:/bin/find用法:find 搜索范围 匹配条件其他:举例:find /root -name initfind /root -size +1024fi ...

  2. Qt之QSS（QDarkStyleSheet）

    简述 关于样式,前面介绍了很多内容,下面分享一个深色样式表,很值得借鉴! 简述 效果 QSS 更多参考 效果 QSS /* * The MIT License (MIT) * * Copyright ...

  3. struts2 拦截器的注册在strut.xml中

    根据需要:需要在struts.xml中注册拦截器为以下内容  根据自己的业务需要更改参数 <!DOCTYPE struts PUBLIC "-//Apache Software Fou ...

  4. 第四周 更新Scrum站立会议

    项目名称:连连看游戏(C#) 小组名称:4Boys 小组成员:武志远.李权.张金生.张政 站立会议内容 昨天完成的: 1.张金生主要介绍了自己完成了游戏界面 2.武志远主要负责查阅关于技术方面的资料, ...

  5. Servlet的尾(yi)巴---filter ( 过滤器 )的小应用

    该,该,该.......,继之前说到的 Filter 现在用这个来做一个小小的应用---------->  铛,铛,铛,铛.....  ->_->      <丑逼的留言板&g ...

  6. hdu-----（1151）Air Raid（最小覆盖路径）

    Air Raid Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Su ...

  7. Eclipse创建第一个springWebMVC项目

    1.第一步:配置中央调度器(DispatcherServlet) 2.第二步:配置处理器(Controller) 3.第三步:在applicationContext.xml文件中注册控制器 注:记得头 ...

  8. Aeroplane chess（HDU 4405）

    Aeroplane chess Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)T ...

  9. VSS Plugin配置FAQ（翻译）[转]

    前言(译者) 就个人的成长历程来说,刚参加工作用的是 CVS ,前前后后有接近三年的使用体验,从今年开始使用 SVN .总的来说我更喜欢 SVN ,用起来的确很方便,例如在本地源代码文件中加一个空格然 ...

  10. ant非法字符：\65279 错误

    ant非法字符:\65279 错误前段时间用ant把项目打包,遇到一个问题:编译java文件的时候,有些java文件报非法字符 \65279错误,在网上找和很多方法,也试了很多方法,换JDK,网上说的 ...