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


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 相关文章推荐
html文件中jquery与velocity变量中的$冲突的解决方法
Nov 01 Javascript
JavaScript实现列出数组中最长的连续数
Dec 29 Javascript
jQuery实现的图片轮播效果完整示例
Sep 12 Javascript
用headjs来管理和加载js 提高网站加载速度
Nov 29 Javascript
canvas红包照片实例分享
Feb 28 Javascript
JS实现的Unicode编码转换操作示例
Apr 28 Javascript
浅谈Vue-cli单文件组件引入less,sass,css样式的不同方法
Mar 13 Javascript
angularjs结合html5实现拖拽功能
Jun 25 Javascript
React Native基础入门之调试React Native应用的一小步
Jul 02 Javascript
对layui初始化列表的CheckBox属性详解
Sep 13 Javascript
在pycharm中开发vue的方法步骤
Mar 04 Javascript
vue 在服务器端直接修改请求的接口地址
Dec 19 Vue.js
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&amp;MYSQL服务器配置说明
2006/10/09 PHP
PHP 开发环境配置(Zend Studio)
2010/04/28 PHP
php在服务器执行exec命令失败的解决方法
2012/03/03 PHP
php_screw 1.5:php加密: 安装与使用详解
2013/06/20 PHP
windows下安装php的memcache模块的方法
2015/04/07 PHP
JavaScript 异步方法队列链实现代码分析
2010/06/05 Javascript
js setTimeout 参数传递使用介绍
2013/08/13 Javascript
Javascript全局变量var与不var的区别深入解析
2013/12/09 Javascript
JS OffsetParent属性深入解析
2014/01/13 Javascript
jquery datatable后台封装数据示例代码
2014/08/07 Javascript
使用js画图之圆、弧、扇形
2015/01/12 Javascript
Javascript非构造函数的继承
2015/04/27 Javascript
freemarker判断对象是否为空的方法
2015/08/13 Javascript
Ionic如何创建APP项目
2016/06/03 Javascript
通过命令行生成vue项目框架的方法
2017/07/12 Javascript
JavaScript格式化json和xml的方法示例
2019/01/22 Javascript
layui点击弹框页面 表单请求的方法
2019/09/21 Javascript
原生JS运动实现轮播图
2021/01/02 Javascript
[39:53]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第一场 11.19
2020/11/19 DOTA
Python通过future处理并发问题
2017/10/17 Python
Python工厂函数用法实例分析
2018/05/14 Python
python向字符串中添加元素的实例方法
2019/06/28 Python
Python操作注册表详细步骤介绍
2020/02/05 Python
Python API len函数操作过程解析
2020/03/05 Python
Python接口测试环境搭建过程详解
2020/06/29 Python
python判断变量是否为列表的方法
2020/09/17 Python
pip install命令安装扩展库整理
2021/03/02 Python
详解CSS3开启硬件加速的使用和坑
2017/08/21 HTML / CSS
TripAdvisor日本:全球领先的旅游网站
2019/02/14 全球购物
秋游活动策划方案
2014/02/16 职场文书
食品安全宣传标语
2014/06/07 职场文书
机电一体化毕业生自荐信
2014/06/19 职场文书
社区娱乐活动方案
2014/08/21 职场文书
捐书倡议书
2014/08/29 职场文书
会计工作检讨书
2015/02/19 职场文书
Redis分布式锁Redlock的实现
2021/08/07 Redis