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


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的滚动条滚动固定div(附演示下载)
Oct 29 Javascript
JSON.parse()和JSON.stringify()使用介绍
Jun 20 Javascript
JavaScript事件委托技术实例分析
Feb 06 Javascript
Javascript简单改变表单元素背景的方法
Jul 15 Javascript
js实现左侧网页tab滑动门效果代码
Sep 06 Javascript
解决LayUI表单获取不到data的问题
Aug 20 Javascript
vue中的计算属性实例详解
Sep 19 Javascript
重学JS之显示强制类型转换详解
Jun 30 Javascript
layui使用form表单实现post请求页面跳转的方法
Sep 14 Javascript
jQuery实现简单聊天室
Feb 08 jQuery
利用js实现简易红绿灯
Oct 15 Javascript
vue项目打包后路由错误的解决方法
Apr 13 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 exif扩展方法开启详解
2014/07/28 PHP
Zend Framework入门教程之Zend_Registry组件用法详解
2016/12/09 PHP
PHP集成环境XAMPP的安装与配置
2018/11/13 PHP
php根据地址获取百度地图经纬度的实例方法
2019/09/03 PHP
解决Laravel5.2 Auth认证退出失效的问题
2019/10/14 PHP
网页里控制图片大小的相关代码
2006/06/13 Javascript
用jQuery模拟页面加载进度条的实现代码
2011/12/19 Javascript
关于include标签导致js路径找不到的问题分析及解决
2013/07/09 Javascript
jquery 列表双向选择器之改进版
2013/08/09 Javascript
js中substr,substring,indexOf,lastIndexOf,split,replace的用法详解
2015/11/09 Javascript
JS基于onclick事件实现单个按钮的编辑与保存功能示例
2017/02/13 Javascript
layui分页效果实现代码
2017/05/19 Javascript
基于jquery日历价格、库存等设置插件
2020/07/05 jQuery
vue-cli3使用 DllPlugin 实现预编译提升构建速度
2019/04/24 Javascript
Layui 带多选框表格监听事件以及按钮自动点击写法实例
2019/09/02 Javascript
javascript二维数组和对象的深拷贝与浅拷贝实例分析
2019/10/26 Javascript
jquery实现聊天机器人
2020/02/08 jQuery
Python3实现二叉树的最大深度
2019/09/30 Python
Python如何省略括号方法详解
2020/03/21 Python
使用PyQt5实现图片查看器的示例代码
2020/04/21 Python
python 实现PIL模块在图片画线写字
2020/05/16 Python
HTML5 canvas基本绘图之绘制矩形
2016/06/27 HTML / CSS
GUESS西班牙官方网上商城:美国服饰品牌
2017/03/15 全球购物
宝拉珍选英国官网:Paula’s Choice英国
2019/05/29 全球购物
Linux面试经常问的文件系统操作命令
2015/11/05 面试题
文科教师毕业的自我评价
2014/01/16 职场文书
事业单位竞聘上岗实施方案
2014/03/28 职场文书
《吃水不忘挖井人》教学反思
2014/04/15 职场文书
项目合作协议书
2014/04/16 职场文书
科学发展观活动总结
2014/08/28 职场文书
爱牙日活动总结
2014/08/29 职场文书
四川省传达学习贯彻党的群众路线教育实践活动总结大会精神新闻稿
2014/10/26 职场文书
语文教师个人工作总结
2015/02/06 职场文书
关于办理居住证的介绍信模板
2019/11/27 职场文书
pytorch 两个GPU同时训练的解决方案
2021/06/01 Python
Docker容器harbor私有仓库部署和管理
2022/08/05 Servers