JavaScript实现自动弹出窗口并自动关闭窗口的方法


Posted in Javascript onAugust 06, 2015

本文实例讲述了JavaScript实现自动弹出窗口并自动关闭窗口的方法。分享给大家供大家参考。具体如下:

这里介绍的JavaScript自动弹出窗口并自动关闭窗口,JS实现此特效似乎很简单,打开网页后即显示一个弹出窗口,之后会自动离开,使用了window.open和document.open();以及document.close();对象共同来实现,现在似乎用的不多了。

运行效果如下图所示:

JavaScript实现自动弹出窗口并自动关闭窗口的方法

具体代码如下:

<HTML>
<HEAD>
<TITLE>自动离开的窗口</TITLE>
<SCRIPT>
<!--
var flyingwin
var popupwidth=200
var popupheight=150
var marginright
var windowcenter
var i_top=200
var i_left=-popupwidth-50
var step=40
var timer
var waitingtime=5000
var pause=20
function showWindow() {
 flyingwin = window.open("", "flyingwin", "toolbar=no,width="+popupwidth+",height="+popupheight+",top=100,left="+(-popupwidth)+"");
 flyingwin.document.open();
 flyingwin.document.write("<html><title>自动离开的窗口</title><body><p align=center>请不要关闭,马上就离开:(</body></html>");
 flyingwin.document.close();
 if (document.all) {
  marginright = screen.width+50
 }
 if (document.layers) {
  marginright = screen.width+50
 }
 windowcenter=Math.floor(marginright/2)-Math.floor(popupwidth/2)
 movewindow()
}
function movewindow() {
  if (i_left<=windowcenter) {
   flyingwin.moveTo(i_left,i_top)
   i_left+=step
   timer= setTimeout("movewindow()",pause)
  }
  else {
   clearTimeout(timer)
   timer= setTimeout("movewindow2()",waitingtime)
  }
}
function movewindow2() {
  if (i_left<=marginright) {
   flyingwin.moveTo(i_left,i_top)
   i_left+=step
   timer= setTimeout("movewindow2()",pause)
  }
  else {
   clearTimeout(timer)
   flyingwin.close()
  }
}
// -->
</SCRIPT>
</HEAD>
<BODY onload=showWindow()> </BODY>
</HTML>

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

Javascript 相关文章推荐
P3P Header解决Cookie跨域的问题
Mar 12 Javascript
JS定时关闭窗口的实例
May 22 Javascript
jQuery中.live()方法的用法深入解析
Dec 30 Javascript
调用jQuery滑出效果时闪烁的解决方法
Mar 27 Javascript
浅谈javascript中的call、apply、bind
Mar 06 Javascript
JS、jQuery中select的用法详解
Apr 21 Javascript
Bootstrap基本组件学习笔记之导航(10)
Dec 07 Javascript
Angular的$http与$location
Dec 26 Javascript
JavaScript的继承实现小结
May 07 Javascript
Vue不能检测到Object/Array更新的情况的解决
Jun 26 Javascript
jQuery实现的3D版图片轮播示例【滑动轮播】
Jan 18 jQuery
jQuery实现文本显示一段时间后隐藏的方法分析
Jun 20 jQuery
JS实现从网页顶部掉下弹出层效果的方法
Aug 06 #Javascript
JS实现可直接显示网页代码运行效果的HTML代码预览功能实例
Aug 06 #Javascript
PHP+jQuery+Ajax+Mysql如何实现发表心情功能
Aug 06 #Javascript
js实现简单秒表走动的时钟特效
Mar 25 #Javascript
javascript实现鼠标放上后下边对应内容变换的效果
Aug 06 #Javascript
JS实现跟随鼠标的链接文字提示框效果
Aug 06 #Javascript
jquery实现仿新浪微博评论滚动效果
Aug 06 #Javascript
You might like
PHP 分页原理分析,大家可以看看
2009/12/21 PHP
php file_put_contents()功能函数(集成了fopen、fwrite、fclose)
2011/05/24 PHP
PHP实现RTX发送消息提醒的实例代码
2017/01/03 PHP
php 删除指定文件夹的实例讲解
2017/07/25 PHP
PHP设计模式(四)原型模式Prototype实例详解【创建型】
2020/05/02 PHP
jquery插件之easing使用
2010/08/19 Javascript
nodejs npm包管理的配置方法及常用命令介绍
2014/06/05 NodeJs
jQuery实现的支持IE的html滑动条
2015/03/16 Javascript
javascript无刷新评论实现方法
2015/05/13 Javascript
JavaScript原生xmlHttp与jquery的ajax方法json数据格式实例
2015/12/04 Javascript
省市区三级联动jquery实现代码
2020/04/15 Javascript
解决Vue使用mint-ui loadmore实现上拉加载与下拉刷新出现一个页面使用多个上拉加载后冲突问题
2017/11/07 Javascript
基于JavaScript实现抽奖系统
2018/01/16 Javascript
通过实例解析js简易模块加载器
2019/06/17 Javascript
jQuery实现雪花飘落效果
2020/08/02 jQuery
[01:51]2014DOTA2西雅图邀请赛 MVP 外卡赛black场间采访
2014/07/09 DOTA
[58:18]2018DOTA2亚洲邀请赛3月29日 小组赛B组 iG VS Mineski
2018/03/30 DOTA
介绍Python的Django框架中的QuerySets
2015/04/20 Python
spyder常用快捷键(分享)
2017/07/19 Python
Python实现判断给定列表是否有重复元素的方法
2018/04/11 Python
python爬取足球直播吧五大联赛积分榜
2018/06/13 Python
使用Template格式化Python字符串的方法
2019/01/22 Python
对python 树状嵌套结构的实现思路详解
2019/08/09 Python
python3的数据类型及数据类型转换实例详解
2019/08/20 Python
使用python远程操作linux过程解析
2019/12/04 Python
使用tensorflow实现矩阵分解方式
2020/02/07 Python
python Autopep8实现按PEP8风格自动排版Python代码
2021/03/02 Python
用HTML5中的Canvas结合公式绘制粒子运动的教程
2015/05/08 HTML / CSS
Schutz鞋官方网站:Schutz Shoes
2017/12/13 全球购物
Charles & Colvard官网:美国莫桑石品牌
2019/06/05 全球购物
不用游标的SQL语句有哪些
2012/09/07 面试题
初二物理教学反思
2014/01/29 职场文书
加班费申请报告
2015/05/15 职场文书
Canvas跟随鼠标炫彩小球的实现
2021/04/11 Javascript
特别篇动画《总之就是非常可爱 ~制服~》PV公开,2022年夏季播出
2022/04/04 日漫
基于Python实现对比Exce的工具
2022/04/07 Python