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 相关文章推荐
LBS blog sql注射漏洞[All version]-官方已有补丁
Aug 26 Javascript
利用try-catch判断变量是已声明未声明还是未赋值
Mar 12 Javascript
js实现页面跳转重定向的几种方式
May 29 Javascript
js怎么判断flash swf文件是否加载完毕
Aug 14 Javascript
js图片翻书效果代码分享
Aug 20 Javascript
jQuery在线选座位插件seat-charts特效代码分享
Aug 27 Javascript
Jquery中map函数的用法
Jun 03 Javascript
JS简单设置下拉选择框默认值的方法
Aug 20 Javascript
微信小程序 图片加载(本地,网路)实例详解
Mar 10 Javascript
bootstrap table实现双击可编辑、添加、删除行功能
Sep 27 Javascript
Electron 打包问题:electron-builder 下载各种依赖出错(推荐)
Jul 09 Javascript
vue实现省市区联动 element-china-area-data插件
Apr 22 Vue.js
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中上传大体积文件时需要的设置
2006/10/09 PHP
php数据库密码的找回的步骤
2011/01/12 PHP
实现PHP多线程异步请求的3种方法
2014/01/17 PHP
php中ob_flush函数和flush函数用法分析
2015/03/18 PHP
浅析php如何实现爬取数据原理
2018/09/27 PHP
javascript在myeclipse中报错的解决方法
2013/10/29 Javascript
js中for in的用法示例解析
2013/12/25 Javascript
JS判断网页广告是否被浏览器拦截过滤的代码
2015/04/05 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
2016/01/12 Javascript
利用VUE框架,实现列表分页功能示例代码
2017/01/12 Javascript
javascript判断元素存在和判断元素存在于实时的dom中的方法
2017/01/17 Javascript
详谈jQuery中的一些正则匹配表达式
2017/03/08 Javascript
详解Vue学习笔记进阶篇之列表过渡及其他
2017/07/17 Javascript
echarts学习笔记之箱线图的分析与绘制详解
2017/11/22 Javascript
vuex + axios 做登录验证 并且保存登录状态的实例
2018/09/16 Javascript
JavaScript原型对象原理与应用分析
2018/12/27 Javascript
详解VUE调用本地json的使用方法
2019/05/15 Javascript
p5.js绘制旋转的正方形
2019/10/23 Javascript
浅谈Node新版本13.2.0正式支持ES Modules特性
2019/11/25 Javascript
JavaScript实现联动菜单特效
2020/01/07 Javascript
Vue中import from的来源及省略后缀与加载文件夹问题
2020/02/09 Javascript
在Python中使用PIL模块处理图像的教程
2015/04/29 Python
Python编程之多态用法实例详解
2015/05/19 Python
python生成器generator用法实例分析
2015/06/04 Python
python实现爬山算法的思路详解
2019/04/09 Python
使用Python的datetime库处理时间(RPA流程)
2019/11/24 Python
借助Paramiko通过Python实现linux远程登陆及sftp的操作
2020/03/16 Python
PyInstaller的安装和使用的详细步骤
2020/06/02 Python
Python基于os.environ从windows获取环境变量
2020/06/09 Python
Pyinstaller加密打包应用的示例代码
2020/06/11 Python
英国和世界各地鲜花速递专家:Arena Flowers
2018/02/10 全球购物
海量信息软件测试笔试题
2015/08/08 面试题
排查整治工作方案
2014/06/09 职场文书
无私奉献演讲稿
2014/09/04 职场文书
授权委托书公证
2014/09/14 职场文书
2014年干部作风建设总结
2014/10/23 职场文书