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 相关文章推荐
让任务管理器中的CPU跳舞的js代码
Nov 01 Javascript
扒一扒JavaScript 预解释
Jan 28 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
Sep 16 Javascript
Angularjs在初始化未完毕时出现闪烁问题的解决方法分析
Aug 05 Javascript
js导出excel文件的简洁方法(推荐)
Nov 02 Javascript
jQuery Ajax使用FormData上传文件和其他数据后端web.py获取
Jun 11 jQuery
Node.js 8 中的重要新特性
Jun 28 Javascript
JS/jQuery实现DIV延时几秒后消失或显示的方法
Feb 12 jQuery
详解使用mpvue开发github小程序总结
Jul 25 Javascript
webpack4 + react 搭建多页面应用示例
Aug 03 Javascript
IE11下处理Promise及Vue的单项数据流问题
Jul 24 Javascript
原生js代码能实现call和bind吗
Jul 31 Javascript
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伪静态写法附代码
2008/06/20 PHP
php join函数应用
2011/05/04 PHP
php按字符无乱码截取中文的方法
2015/03/27 PHP
PHP中类的继承和用法实例分析
2016/05/24 PHP
详解PHP 二维数组排序保持键名不变
2019/03/06 PHP
phpstorm 配置xdebug的示例代码
2019/03/31 PHP
初学Jquery插件制作 在SageCRM的查询屏幕隐藏部分行的功能
2011/12/26 Javascript
php对mongodb的扩展(小试牛刀)
2012/11/11 Javascript
js控制当再次点击按钮时的间隔时间
2014/06/03 Javascript
JavaScript中return false的用法
2015/03/12 Javascript
jQuery构造函数init参数分析续
2015/05/13 Javascript
jQuery实现鼠标选文字发新浪微博的方法
2016/04/02 Javascript
Angular 4.X开发实践中的踩坑小结
2017/07/04 Javascript
JS+canvas动态绘制饼图的方法示例
2017/09/12 Javascript
JS 正则表达式验证密码、邮箱格式的实例代码
2018/10/28 Javascript
vue微信分享插件使用方法详解
2020/02/18 Javascript
Vue事件处理原理及过程详解
2020/03/11 Javascript
npm全局环境变量配置详解
2020/12/15 Javascript
js实现验证码干扰(动态)
2021/02/23 Javascript
Python异常学习笔记
2015/02/03 Python
python 链接和操作 memcache方法
2017/03/04 Python
Python装饰器的执行过程实例分析
2018/06/04 Python
解决python升级引起的pip执行错误的问题
2018/06/12 Python
python 读取dicom文件,生成info.txt和raw文件的方法
2019/01/24 Python
python绘制评估优化算法性能的测试函数
2019/06/25 Python
一篇文章搞定Python操作文件与目录
2019/08/13 Python
python防止随意修改类属性的实现方法
2019/08/21 Python
Python小程序之在图片上加入数字的代码
2019/11/26 Python
keras 两种训练模型方式详解fit和fit_generator(节省内存)
2020/07/03 Python
python批量生成条形码的示例
2020/10/10 Python
如何使用Python自动生成报表并以邮件发送
2020/10/15 Python
详解BeautifulSoup获取特定标签下内容的方法
2020/12/07 Python
员工自我鉴定范文
2013/10/06 职场文书
2014年乡镇纪委工作总结
2014/12/19 职场文书
搞笑欢迎词大全
2015/09/30 职场文书
引用计数法和root搜索算法以及JVM中判定对象需要回收的方法
2022/04/19 Java/Android