本文主要为大家分享超详细的JS弹出窗口代码。本文中的示例代码非常详细，具有一定的参考价值。感兴趣的朋友可以参考一下。
我想大多数人都知道如何使用网页弹出各种窗口，但如何制作各种弹出窗口，我们今天就来学习一下：
1.弹启一个全屏窗口
代码如下：
超文本标记语言
Body //www.jb51.net ，我们，全屏)；；
bwww.jb51.net/b
/body
/html
2.弹启一个被F11化后的窗口
代码如下：
超文本标记语言
Body //www.jb51.net ， we ， channel mode )；
bwww.jb51.net/b
/body
/html
3.弹启一个带有收藏链接工具栏的窗口
代码如下：
超文本标记语言
Www.wangye8.com ，我们，宽度=400，高度=300，董事)；
bwww.wangye8.com/b
/body
/html
4.网页对话框
代码如下：
超文本标记语言
脚本语言=javascript
！-
模态对话框(//www.jb51.net，我们， Dialog width:400 px；dialog height:300 px；
dialog left:200 px；dialog top:150 px；中心：有；求助：可以；可调整大小：是；状态：是’)
//-
/脚本
bwww.wangye8.com/b
/body
/html
超文本标记语言
脚本语言=javascript
！-
ShowEssDialog (//www.jb51.net，我们， dialog width:400 px；dialog height:300 px；
dialog left:200 px；dialog top:150 px；中心：有；求助：可以；可调整大小：是；状态：是’)
//-
/脚本
bhttp://www.wangye8.com/b
/body
/html
ShowModalDialog()或showModelessDialog()用于调用网页对话框。至于showModalDialog()和showModelessDialog()的区别，showModalDialog()打开的窗口(简称模式窗口)放在父窗口上，必须关闭才能访问父窗口(建议尽量少用，以免冒犯)；showModelessDialog()
设置对话框窗口的高度。
设置对话框窗口的宽度。
设置对话框窗口相对于桌面左上角的左边位置。
设置对话框窗口相对于桌面左上角的顶部位置。
居中：{是|否| 1 | 0}指定是否将对话框在桌面上居中。默认值为“是”。
Help: {yes | no | 1 | 0}指定是否在对话框窗口中显示区分上下文的帮助图标。默认值为“是”。
可调整大小：{yes | no | 1 | 0}指定是否可以更改对话框窗口的大小。默认值为“否”。
Status: {yes | no | 1 | 0}指定对话框窗口是否显示状态栏。对于非模态对话框窗口，默认值为“yes”；对于模态对话框窗口，默认值为“否”。
5、其他弹出窗口代码
经常上网的朋友可能都去过这样的网站。他们一进入主页，就会弹出一个窗口，或者按一个链接或按钮就会弹出。通常是一些通知，版权信息，警告，欢迎访问等。或者作者想要特殊提示的信息将显示在该窗口中。其实制作这样的页面非常容易，只需要在页面的HTML中添加几个java脚本代码就可以了。下面我带你分析一下它的玄机。
【最基本的弹出窗口代码】
实际上，代码非常简单：
代码如下：
脚本语言=java script
！-
window.open (page.html )
-
/脚本
因为这是一段java脚本代码，所以它们应该放在SCRIPT LANGUAGE=java script 标记和/script之间。-和-适用于一些较低版本的浏览器。在这些较旧的浏览器中，如果不支持java脚本，标签中的代码将不会显示为文本。
Window.open (page.html )用于控制新窗口page.html的弹出。如果page.html与主窗口不在同一个路径中，那么路径应该写在它的前面。绝对路径(3358)和相对路径(./)都可以。
可以用单引号和双引号，但不要混用。
这段代码可以添加到HTML中的任何地方，或者添加到head和/head之间。位置越早，执行得越早，尤其是页面代码很长的时候。如果想让页面早一点弹出，尽量往前放。
【经过设置后的弹出窗口】
先说一下弹窗外观的设置。在上面的代码中添加一些东西就可以了。
让我们自定义这个弹出窗口的外观、大小和弹出位置，以适合这个页面的具体情况。
代码如下：
脚本语言=java脚本：
！-
window.open (page.html ， newwindow ， height=100，width=400，top=0，left=0，toolbar=no，menubar=no，scrollbars=no，resizable=no，
位置=否，状态=否’)
//写成一行
-
/脚本
参数解释：
脚本语言=java script js脚本开始；
Window.open命令弹出一个新窗口；
在page.html弹出的新窗口的文件名；
newwindow弹出窗口的名称(不是文件名)可以替换为empty "；
高度=100窗高；
Top=0窗口距屏幕顶部的像素值；
Left=0距离屏幕左侧的窗口的像素值；
Toolbar=否是否显示工具栏，是显示；
Menubar，scrollbars的意思是菜单栏和滚动条；
Resizable=no是否允许改变窗口大小，yes是允许；
Location=no是否显示地址栏，是允许；
Status=no是否显示状态栏中的信息(通常文件已经打开)，yes是允许的；
/SCRIPT js脚本结束。
【用函数控制弹出窗口】
以下是完整的代码。
代码如下：
超文本标记语言
头
脚本语言=java script
！-
函数openwin(){
window.open(page.html ， newwindow ， height=100，width=400，toolbar=no，menubar=no，scrollbars=no，resizable=no，
位置=否，状态=否；)
//写成一行
}
-
/脚本
/头
身体
.任何页面内容。
/body
/html
这里定义了一个函数openwin()，其内容是打开一个窗口。在被调用之前，它没有任何用处。怎么称呼？
方法一：
阅读页面时弹出正文浏览器；方法二：
正文浏览器离开页面时的弹出窗口；方法三：
通过连接调用：a href=# 打开一个窗口/a注意：使用的 # 是一个虚拟连接。
方法四：
用按钮调用：输入类型=按钮值=打开窗口【主窗口打开文件1.htm，同时弹出小窗口page.html】
将以下代码添加到主窗口的标题区域：
代码如下：
脚本语言=java script
！-
函数openwin(){
window.open(page.html ，， width=200，height=200 )；)
}
//-
/脚本
添加到正文区域：a href= 1.htm open/a。
【弹出的窗口之定时关闭控制】
我们来控制一下弹出窗口，效果会更好。如果我们在弹出页面中添加一小段代码(注意是添加到page.html的HTML中，而不是主页面，否则……)，让它10秒后自动关闭不是更酷吗？
首先，将以下代码添加到page.html文件的头区域：
代码如下：
脚本语言=java script
函数closeit() {
SetTimeout (self.close()，10000)//毫秒
}
/脚本
然后，用body一词替换page.html中原来的BODY一句。别忘了写这句话！这句话的作用是调用代码关闭窗口，10秒后再自行关闭窗口。)
【在弹出窗口中加上一个关闭按钮】
代码如下：
形式
Type= button value= off
/表单
呵呵，现在更完美了。
【内包含的弹出窗口——一个页面两个窗口】
上面的例子都包含两个窗口，一个是主窗口，一个是小弹出窗口。
有了下面这个例子，你就可以在一个页面中完成上面的效果。
代码如下：
超文本标记语言
头
脚本语言=java script
函数openwin()
{
OpenWindow=window.open(， newwin ， height=250，width=250，toolbar=no，scrollbars= scroll ，menubar=no )；);
//写成一行
打开window.document.write(标题示例/标题)；)
open window . document . write( BODY BGCOLOR=# FFFFFF )；)
open window . document . write( h1 hello！/h1’；)
OpenWindow.document.write(新窗口已打开！；)
open window . document . write(/BODY )；)
open window . document . write(/HTML )。)
OpenWindow.document.close()
}
/脚本
/头
身体
A href=# 打开一个窗口/a
Type= button value=打开窗口
/body
/html
查看OpenWindow.document.write()中的代码。不是标准的HTML吗？按照格式多写几行就行了。注意多一个标签或者少一个标签都会出错。记得以OpenWindow.document.close()结尾。
【终极应用——弹出窗口的Cookie控制】
回想一下，上面的弹窗虽然很酷，但是有一点小瑕疵(你沉浸在喜悦中，肯定没注意到吧？)比如你把上面的脚本放在一个需要经常访问的页面上(比如首页)，那么你每刷新一次这个页面，窗口就会弹出一次。是不是很烦？有解决办法吗？是啊！跟我来.我们可以用Cookie来控制它。
首先，将以下代码添加到主页HTML的头部区域：
代码如下：
脚本
函数openpopup(){
Window.open (hello.htm ，， width=300，height=300 )//自己修改弹出窗口
}
函数get_cookie(Name) {
var search=Name =
var return value=“”；
if (documents.cookie.length 0) {
offset=documents . cookie . index of(search)
如果(offset！=-1) { //如果cookie存在
偏移量=搜索长度
//设置值开头的索引
end=documents . cookie . index of(；)，偏移)；
//设置cookie值结尾的索引
if (end==-1)
end=documents . cookie . length；
return value=unescape(documents . cookie . substring(offset，end))
}
}
返回returnvalue
}
函数loadpopup(){
if (get_cookie(popped)==){
openpopup()
documents.cookie=popped=yes
}
}
/脚本
在正文区域键入以下代码：
正文//离开页面时弹出
或者：
正文//进入页面时弹出
你可以尝试刷新这个页面或者重新进入，窗口就再也不会弹出来了。真正的流行只有一次
至此，弹窗的制作和应用技巧基本完成。希望对正在做网页的朋友有所帮助，会很欣慰。
应该注意的是，JS脚本中的大小写应该是一致的。
没有菜单、工具栏、地址栏的弹出窗口：
代码如下：
脚本语言=java script
！-
var gt=unescape( > )；
var popup=null
var over=启动弹出导航器；
popup=window.open(， popupnav ， width=500，height=500，resizable=0，scroll bars=auto )；//width=500，height=500是窗口的长和宽。
如果(弹出！=null) {
if (popup.opener==null) {
popup.opener=self}
Popup.location.href=要打开的文件名；
}
//-
/脚本
方法二：Cookies应用：控制弹出窗口。当我们在页面中设置弹窗时，每次再次浏览页面时，弹窗都会自动弹出，造成不必要的麻烦。那么如何解决这个问题呢？这里我用一个简单的例子来说明如何通过操作Cookies让弹窗只在第一次浏览页面时弹出，以后就不会很烦了！
复制代码如下：脚本函数open pop window(){ window . open( hello . htm ，， width=200，height=200 //自己修改弹出窗口}函数get _ cookie(name){ var search=name =；var return value=“”；if(documents . cookie . length 0){ offset=documents . cookie . index of(search)；如果(offset！=-1) {//如果offset=search.length之前有cookies记录；//设置cookie end=documents . cookie . index of的起始位置(；，偏移)；//设置cookie的结束位置if(end==-1)end=documents . cookie . length；return value=unescape(documents . cookie . substring(offset，end))} } return return value；}函数load popup(){ if(get _ cookie( popped )== ){ openpopwindow()；documents.cookie= popped=yes} }/脚本
在BODY区域输入上面的代码：离开页面会弹出body //。
或者：body //打开页面时弹出离开页面时弹出效果：
效果：当别人关闭这个页面时，会弹出一个窗口，你可以写一些祝福的话。
核心代码：
代码如下：
脚本语言=javascript
！- Begin函数leave(){
窗口.打开
( 1.htm ，， toolbar=no，menubar=no，location=no，height=225，width=235))；
破裂
}
//结束-
/脚本
这就是本文的全部内容。希望对大家的学习有帮助，支持我们。
