网页中可关闭的漂浮窗口实现可自行调节


Posted in Javascript onAugust 20, 2013

注释部分为广告的左右调节,可以自行设定

<!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> 
<title>网页中可关闭的漂浮窗口</title> 
<meta http-equiv="content-type" content="text/html;charset=gb2312"> 
</head> <body style="background-color:#09C"> 
<div id="ShowAD" style="position:absolute;z-index:100;"> 
<div style="width:135;height:18px;font-size:14px;font-weight:bold;text-align:left;cursor:hand;" onClick="closead();"><font color="ff0000">关闭</font><br/> 
点击这里,关闭广告!!!<br><a href="/jscss/"><img src="img/ads1.png"></a> 
</div> 
<script type="text/javascript"> 
var bodyfrm = ( document.compatMode.toLowerCase()=="css1compat" ) ? document.documentElement : document.body; 
var adst = document.getElementById("ShowAD").style; 
adst.top = ( bodyfrm.clientHeight -530-22 ) + "px"; 
//adst.left = ( bodyfrm.clientWidth -155) + "px"; 
function moveR() 
{ 
adst.top = ( bodyfrm.scrollTop + bodyfrm.clientHeight - 530-22) + "px"; 
//adst.left = ( bodyfrm.scrollLeft + bodyfrm.clientWidth - 155 ) + "px"; 
} 
setInterval("moveR();", 80); 
function closead() 
{ 
adst.display='none'; 
} 
</script> 
<div id="Content" style="height:1200px;"></div> 
</body> 
</html>
Javascript 相关文章推荐
基于jquery的一个拖拽到指定区域内的效果
Sep 21 Javascript
js克隆对象、数组的常用方法介绍
Sep 26 Javascript
XML、HTML、CSS与JS的区别整理
Feb 18 Javascript
JS+CSS3制作炫酷的弹窗效果
Nov 08 Javascript
JS实现的简单轮播图运动效果示例
Dec 22 Javascript
JS异步执行结果获取的3种解决方式
Feb 19 Javascript
Bootstrap 时间日历插件bootstrap-datetimepicker配置与应用小结
May 28 Javascript
JAVA面试题 static关键字详解
Jul 16 Javascript
微信小程序事件流原理解析
Nov 27 Javascript
js实现百度登录窗口拖拽效果
Mar 19 Javascript
详解webpack的文件监听实现(热更新)
Sep 11 Javascript
javascript条件式访问属性和箭头函数介绍
Nov 17 Javascript
js判断选择的时间是否大于今天的代码
Aug 20 #Javascript
JQuery获取样式中的background-color颜色值的问题
Aug 20 #Javascript
jQuery制作仿腾讯web qq用户体验桌面
Aug 20 #Javascript
jquery indexOf使用方法
Aug 19 #Javascript
js里取容器大小、定位、距离等属性搜集整理
Aug 19 #Javascript
没有document.getElementByName方法
Aug 19 #Javascript
js中符号转意问题示例探讨
Aug 19 #Javascript
You might like
如何写php程序?
2006/12/08 PHP
PHP中3种生成XML文件方法的速度效率比较
2012/10/06 PHP
PHP实现查询两个数组中不同元素的方法
2016/02/23 PHP
laravel 解决路由除了根目录其他都404的问题
2019/10/18 PHP
JavaScript 精粹读书笔记(1,2)
2010/02/07 Javascript
Js获取数组最大和最小值示例代码
2013/10/29 Javascript
Bootstrap多级导航栏(级联导航)的实现代码
2016/03/08 Javascript
AngularGauge 属性解析详解
2016/09/06 Javascript
正则 js分转元带千分符号详解
2017/03/08 Javascript
react开发中如何使用require.ensure加载es6风格的组件
2017/05/09 Javascript
用p5.js制作烟花特效的示例代码
2018/03/21 Javascript
vue 公共列表选择组件,引用Vant-UI的样式方式
2020/11/02 Javascript
element 动态合并表格的步骤
2020/12/31 Javascript
使用Python的Scrapy框架编写web爬虫的简单示例
2015/04/17 Python
python paramiko模块学习分享
2017/08/23 Python
Selenium定时刷新网页的实现代码
2018/10/31 Python
详解Python locals()的陷阱
2019/03/26 Python
python实现文本进度条 程序进度条 加载进度条 单行刷新功能
2019/07/03 Python
Python 字符串类型列表转换成真正列表类型过程解析
2019/08/26 Python
详解使用django-mama-cas快速搭建CAS服务的实现
2019/10/30 Python
python 安装库几种方法之cmd,anaconda,pycharm详解
2020/04/08 Python
python爬虫学习笔记之pyquery模块基本用法详解
2020/04/09 Python
pyspark给dataframe增加新的一列的实现示例
2020/04/24 Python
Python gevent协程切换实现详解
2020/09/14 Python
W3C公布最新的HTML5标准草案
2008/10/17 HTML / CSS
美国婚戒购物网站:Anjays Designs
2017/06/28 全球购物
意大利男装网店:Vrients
2019/05/02 全球购物
Collection和Collections的区别
2016/05/02 面试题
网友共享的几个面试题关于Java和Unix等方面的
2016/09/08 面试题
教师辞职报告范文
2014/01/20 职场文书
房屋出租协议书范本(标准版)
2014/09/24 职场文书
银行授权委托书范本
2014/10/04 职场文书
2015秋季幼儿园开学寄语
2015/03/25 职场文书
主持稿开场白
2015/06/01 职场文书
超级实用的公文标题大全!
2019/07/19 职场文书
Mybatis-plus在项目中的简单应用
2021/07/01 Java/Android