JS实现5秒钟自动封锁div层的方法


Posted in Javascript onFebruary 20, 2015

本文实例讲述了JS实现5秒钟自动封锁div层的方法。分享给大家供大家参考。具体实现方法如下:

<html>

<head>

<title>JS实现5秒钟自动封锁div层</title>

<style type="text/css">

<!--

#sponsorAdDiv {position:absolute; height:1; width:1; top:0; left:0;}

-->

</style>

</head>

<body>

<SCRIPT LANGUAGE="JavaScript1.2">

adTime=5;  //封锁窗口期待的时间

chanceAd=1;

var ns=(document.layers);

var ie=(document.all);

var w3=(document.getElementById && !ie);

adCount=0;

function initAd(){

        if(!ns && !ie && !w3) return;

        if(ie)                adDiv=eval('document.all.sponsorAdDiv.style');

        else if(ns)        adDiv=eval('document.layers["sponsorAdDiv"]');

        else if(w3)        adDiv=eval('document.getElementById("sponsorAdDiv").style');

        randAd=Math.ceil(Math.random()*chanceAd);

        if (ie||w3)

        adDiv.visibility="visible";

        else

        adDiv.visibility ="show";

        if(randAd==1) showAd();

}

function showAd(){

if(adCount<adTime*10){adCount+=1;

        if (ie){documentWidth  =document.body.offsetWidth/2+document.body.scrollLeft-20;

        documentHeight =document.body.offsetHeight/2+document.body.scrollTop-20;}

        else if (ns){documentWidth=window.innerWidth/2+window.pageXOffset-20;

        documentHeight=window.innerHeight/2+window.pageYOffset-20;}

        else if (w3){documentWidth=self.innerWidth/2+window.pageXOffset-20;

        documentHeight=self.innerHeight/2+window.pageYOffset-20;}

        adDiv.left=documentWidth-200;adDiv.top =documentHeight-200;

        setTimeout("showAd()",100);}else closeAd();

}

function closeAd(){

if (ie||w3)

adDiv.display="none";

else

adDiv.visibility ="hide";

}

onload=initAd;

</script>

<div id="sponsorAdDiv" style="visibility:hidden">

<table width="450" height="350" bgcolor="008000"><tr><td>

<table width="445" height="345" bgcolor="F0FFF0"><tr><td>

<center>welcome to www.CsrCode.cn!<BR><BR>这个窗口将在5秒后自动封锁</center>

</td></tr></table></td></tr></table></div> 

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
繁简字转换功能
Jul 19 Javascript
jquery parent和parents的区别分析
Oct 02 Javascript
使用jQuery异步加载 JavaScript脚本解决方案
Apr 20 Javascript
jQuery 获取兄弟元素的几种不错方法
May 23 Javascript
使用jquery解析XML示例代码
Sep 05 Javascript
微信小程序 数据绑定详解及实例
Oct 25 Javascript
AngulerJS学习之按需动态加载文件
Feb 13 Javascript
JavaScript实现前端分页控件
Apr 19 Javascript
通过vue-cli来学习修改Webpack多环境配置和发布问题
Dec 22 Javascript
angular6 利用 ngContentOutlet 实现组件位置交换(重排)
Nov 02 Javascript
微信公众号H5之微信分享常见错误和问题(小结)
Nov 14 Javascript
Javascript call及apply应用场景及实例
Aug 26 Javascript
js实现感应鼠标图片透明度变化的方法
Feb 20 #Javascript
js实现鼠标感应向下滑动隐藏菜单的方法
Feb 20 #Javascript
js实现鼠标滚轮控制图片缩放效果的方法
Feb 20 #Javascript
IE及IE6浏览器中判断JS文件加载成功失败的方法
Feb 18 #Javascript
使用JavaScript开发IE浏览器本地插件实例
Feb 18 #Javascript
JQuery实现展开关闭层的方法
Feb 17 #Javascript
jQuery实现鼠标滑过Div层背景变颜色的方法
Feb 17 #Javascript
You might like
PHP添加MySQL数据记录代码
2008/06/07 PHP
19个超实用的PHP代码片段
2014/03/14 PHP
php查询相似度最高的字符串的方法
2015/03/12 PHP
PHP数组操作实例分析【添加,删除,计算,反转,排序,查找等】
2016/12/24 PHP
laravel添加前台跳转成功页面示例
2019/10/22 PHP
网上抓的一个特效
2007/05/11 Javascript
js字符串转换成xml对象并使用技巧解读
2013/04/18 Javascript
如何学习Javascript入门指导
2013/11/01 Javascript
js获取当前地址 JS获取当前URL的示例代码
2014/02/26 Javascript
js实现iframe跨页面调用函数的方法
2014/12/13 Javascript
node.js中的fs.truncate方法使用说明
2014/12/15 Javascript
JQuery中serialize()用法实例分析
2015/02/06 Javascript
transport.js和jquery冲突问题的解决方法
2015/02/10 Javascript
jquery动态导航插件dynamicNav用法实例分析
2015/09/06 Javascript
详解vue 模版组件的三种用法
2017/07/21 Javascript
vue项目使用.env文件配置全局环境变量的方法
2019/10/24 Javascript
javascript前端实现多视频上传
2020/12/13 Javascript
Taro小程序自定义顶部导航栏功能的实现
2020/12/17 Javascript
python的三目运算符和not in运算符使用示例
2014/03/03 Python
python3读取excel文件只提取某些行某些列的值方法
2018/07/10 Python
Python多版本开发环境管理工具介绍
2019/07/03 Python
PyQt5通过信号实现MVC的示例
2021/02/06 Python
CSS3 flex布局之快速实现BorderLayout布局
2015/12/03 HTML / CSS
朗仕(Lab series)英国官网:雅诗兰黛集团男士专属护肤品牌
2017/11/28 全球购物
Mountain Hardwear官网:攀岩服装和户外装备
2019/09/26 全球购物
介绍下WebSphere的安全性
2013/01/31 面试题
大学生求职简历的自我评价
2013/10/21 职场文书
中专毕业生的自我鉴定
2013/12/01 职场文书
学生党员公开承诺书
2014/05/28 职场文书
高速铁道技术专业求职信
2014/08/09 职场文书
学校交通安全责任书
2014/08/25 职场文书
好人好事新闻稿
2015/07/17 职场文书
2019年大学生职业生涯规划书
2019/03/25 职场文书
Nginx同一个域名配置多个项目的实现方法
2021/03/31 Servers
Python import模块的缓存问题解决方案
2021/06/02 Python
postgresql使用filter进行多维度聚合的解决方法
2021/07/16 PostgreSQL