下载文档原格式
,'height=500, width=600, top=0, left=24, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no'我们常常在为邮箱弹出的小提示框而感到惊讶，我们也常常为网页弹出的小提示框而感到神气，其实，这都是javascript的功劳，有了javascript的基础，其实你也可以做到下面重点介绍弹出式窗口的相关知识：1、最简单的弹出式窗口<SCRIPT LANGUAGE="javascript"><!--window.open ('pop1.html')--></SCRIPT>2、弹出有样式设置的窗口<SCRIPT LANGUAGE="javascript"><!--window.open ('pop2.html', 'popwindow', 'height=200, width=320, top=0, left=24, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no')--></SCRIPT>上面的代码要写在一行上面''popwindow' 弹出窗口的标题名字;height=200 弹出窗口高度;width=320 弹出窗口宽度;top=0 弹出窗口距离屏幕上方的象素值;left=24 窗口距离屏幕左侧的象素值;toolbar=no 弹出窗口是否显示工具栏，yes为显示;menubar，scrollbars 控制弹出窗口的菜单栏和滚动栏的显示。
resizable=no 是否允许改变弹出窗口大小，yes为允许;location=no 弹出窗口是否显示地址栏，yes为允许;status=no 是否显示状态栏内的信息(通常是文件已经打开)，yes为允许;3、根据自己的需要设置窗口<script language="JavaScript">var gt = unescape('%3e');var popup = null;var over = "Launch Pop-up Navigator";popup = window.open('', 'popupnav', 'width=200,height=170,resizable=1 ,scrollbars=auto'if (popup != null) {if (popup.opener == null) {popup.opener = self;}popup.location.href = '说明窗口内容文件.html'}// --></script>*popup.location.href = '用于说明窗口内容.htm',用于设置窗口中出现的内容的文件名。
弹窗代码大全(收集)以下包括强制弹窗 24小时IP弹窗延时弹窗退弹等我们使用cookie来控制一下就可以了。
首先，将如下代码加入主页面html的<head>区：<script>function openwin(){window.open(”page.html”,”",”width=200,height=200″)}function get_cookie(name){var search = name + “=”var returnvalue = “”;if (documents.cookie.length > 0) {offset = documents.cookie.indexof(search)if (offset != -1) {offset += search.lengthend = documents.cookie.indexof(”;”, offset);if (end == -1)end = documents.cookie.length;returnvalue=”/unescape(documents.cookie.substring(offset,end))”}}return returnvalue;}function loadpopup(){if (get_cookie(’popped’)==”){openwin()documents.cookie=”popped=yes”}}</script>然后，用<body onload=”loadpopup()”>（注意不是openwin而是loadpop啊！）替换主页面中原有的<body>这一句即可。
你可以试着刷新一下这个页面或重新进入该页面，窗口再也不会弹出了。
真正的pop-only-once！写到这里弹出窗口的制作和应用技巧基本上算是完成了，俺也累坏了，一口气说了这么多，希望对正在制作网页的朋友有所帮助俺就非常欣慰了。
JavaScript实现弹出窗⼝效果本⽂实例为⼤家分享了JavaScript实现弹出窗⼝的具体代码，供⼤家参考，具体内容如下思路1、总体使⽤两个div，⼀个作为底层展⽰，⼀个做为弹出窗⼝；2、两个窗⼝独⽴进⾏CSS设计，通过display属性进⾏设置现实与隐藏，此处建议使⽤display属性⽽不是visibility属性，visibility:hidden可以隐藏某个元素，但隐藏的元素仍需占⽤与未隐藏之前⼀样的空间，影响布局；3、在js内设计两个onclick事件，分别指定函数，分别为开启弹窗和关闭弹窗。
⼀、设置两个div<html><title>弹出窗⼝</title><head><meta charset="UTF-8"></head><body>// 底层div<div id="popLayer"></div>// 弹出层div<div id="popDiv"></div></body></html>⼆、对两个div进⾏独⽴CSS设置，弹出窗⼝display设为none<html><title>弹出窗⼝</title><head><meta charset="UTF-8"><style type="text/css">body{background-color: cyan;}#popDiv{display: none;background-color: crimson;z-index: 11;width: 600px;height: 600px;position:fixed;top:0;right:0;left:0;bottom:0;margin:auto;}</style></head><body>// 底层div<div id="popLayer"><button onclick="">弹窗</button></div>// 弹出层div<div id="popDiv"><div class="close">// 关闭按钮超链接<a href="" onclick="">关闭</a></div><p>此处为弹出窗⼝</p></div></body></html>三、定义并设置弹出按钮和关闭窗⼝函数<script type="text/javascript">function popDiv(){// 获取div元素var popBox = document.getElementById("popDiv");var popLayer = document.getElementById("popLayer"); // 控制两个div的显⽰与隐藏popBox.style.display = "block";popLayer.style.display = "block";}function closePop(){// 获取弹出窗⼝元素let popDiv = document.getElementById("popDiv");popDiv.style.display = "none";}</script>四、将函数设置到onclick事件中<button onclick="popDiv();">弹窗</button><a href="javascript:void(0)" onclick="closePop()">关闭</a>五、设置关闭链接CSS和pop界⾯的其余CSS<style type="text/css">/* 关闭链接样式 */#popDiv .close a {text-decoration: none;color: #2D2C3B;}/* 弹出界⾯的关闭链接 */#popDiv .close{text-align: right;margin-right: 5px;background-color: #F8F8F8;}#popDiv p{text-align: center;font-size: 25px;font-weight: bold;}</style>六、整体代码<html><title>弹出窗⼝</title><head><meta charset="UTF-8"><script type="text/javascript">function popDiv(){// 获取div元素var popBox = document.getElementById("popDiv");var popLayer = document.getElementById("popLayer"); // 控制两个div的显⽰与隐藏popBox.style.display = "block";popLayer.style.display = "block";}function closePop(){// 获取弹出窗⼝元素let popDiv = document.getElementById("popDiv");popDiv.style.display = "none";}</script><style type="text/css">body{background-color: cyan;}#popDiv{display: none;background-color: crimson;z-index: 11;width: 600px;height: 600px;position:fixed;top:0;right:0;left:0;bottom:0;margin:auto;}/* 关闭按钮样式 */#popDiv .close a {text-decoration: none;color: #2D2C3B;}/* 弹出界⾯的关闭按钮 */#popDiv .close{text-align: right;margin-right: 5px;background-color: #F8F8F8;}#popDiv p{text-align: center;font-size: 25px;font-weight: bold;}</style></head><body><div id="popLayer"><button onclick="popDiv();">弹窗</button></div><div id="popDiv"><div class="close"><a href="javascript:void(0)" onclick="closePop()">关闭</a></div><p>此处为弹出窗⼝</p></div></body></html>以上就是本⽂的全部内容，希望对⼤家的学习有所帮助，也希望⼤家多多⽀持。
js实现网页右下角弹出窗口代码<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “/TR/xhtml1/DTD/xhtml1-transitional.dtd”><html xmlns=”/1999/xhtml”><head><meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /><title>JavaScript实现网页右下角弹出窗口代码</title></head><style type=”text/css”>#winpop { width:200px; height:0px; position:absolute; right:0; bottom:0; border:1px solid #666; margin:0; padding:1px; overflow:hidden; display:none;}#winpop .title { width:100%; height:22px; line-height:20px; background:#FFCC00; font-weight:bold; text-align:center; font-size:12px;}#winpop .con { width:100%; height:90px; line-height:80px; font-weight:bold; font-size:12px; color:#FF0000; text-decoration:underline; text-align:center}#silu { font-size:12px; color:#666; position:absolute; right:0; text-align:right; text-decoration:underline; line-height:22px;}.close { position:absolute; right:4px; top:-1px; color:#FFF; cursor:pointer}</style><script type=”text/javascript”>function tips_pop(){var MsgPop=document.getElementById(“winpop”);var popH=parseInt(MsgPop.style.height);//将对象的高度转化为数字if (popH==0){MsgPop.style.display=”block”;//显示隐藏的窗口show=setInterval(“changeH(…up‟)”,2);}else {hide=setInterval(“changeH(…down‟)”,2);}}function changeH(str) {var MsgPop=document.getElementById(“winpop”);var popH=parseInt(MsgPop.style.height);if(str==”up”){if (popH<=100){MsgPop.style.height=(popH+4).toString()+”px”;}else{clearInterval(show);}}if(str==”down”){if (popH>=4){MsgPop.style.height=(popH-4).toString()+”px”;}else{clearInterval(hide);MsgPop.style.display=”none”;?? //隐藏DIV}}}window.onload=function(){//加载document.getElementById(…winpop‟).style.height=‟0px‟;setTimeout(“tips_pop()”,800);//3秒后调用tips_pop()这个函数}</script><body><div id=”silu”><button onclick=”tips_pop()”>3秒后会在右下角自动弹出窗口，如果没有弹出请点击这个按钮</button></div><div id=”winpop”><div>您有新的短消息！<span onclick=”tips_pop()”>×</span></div><div>1条未读信息(</div></div></body></html>。
在弹出新窗口的多种方式关闭,父窗口弹出对话框,子窗口直接关闭("< >();<>");关闭,父窗口和子窗口都不弹出对话框,直接关闭("<>");("{ ();}");("<>");弹出窗口刷新当前页面菜单。
菜单栏,工具条,地址栏,状态栏全没有("< >('','','')<>");弹出窗口刷新当前页面("< >('')<>");("<>('','');<>");弹出提示窗口跳到页(在一个窗口中)(" < >('注册成功')'';<> ");关闭当前子窗口,刷新父窗口("<>();<>");("<>()();<>");子窗口刷新父窗口("<>;<>");("<>'';<>");弹出提示窗口.确定后弹出子窗口()("< ''>('发表成功！')('')<>");弹出提示窗口,确定后,刷新父窗口("<>('发表成功！');<>");弹出相同的一页< "" "" "()">("'" "';");< ""><('', '', ', , , , , , , , ') 这句要写成一行><>参数解释：< ""> 脚本开始；弹出新窗口的命令；'' 弹出窗口的文件名；'' 弹出窗口的名字（不是文件名），非必须，可用空''代替；窗口高度；窗口宽度；窗口距离屏幕上方的象素值；窗口距离屏幕左侧的象素值；是否显示工具栏，为显示；，表示菜单栏和滚动栏。
自制网页右下角浮动窗口效果图如下图所示：一．在需要添加浮动窗口的页面的head中引入css代码，代码如下：<!-- 浮动窗口样式css begin --><style type="text/css">#msg_win{border:1px solid#A67901;background:#EAEAEA;width:240px;position:absolute;right:0;font-size:1 2px;font-family:Arial;margin:0px;display:none;overflow:hidden;z-index:99;} #msg_win.icos{position:absolute;top:2px;*top:0px;right:2px;z-index:9;}.icos a{float:left;color:#833B02;margin:1px;text-align:center;font-weight:bold; width:14px;height:22px;line-height:22px;padding:1px;text-decoration:none;font-f amily:webdings;}.icos a:hover{color:#fff;}#msg_title{background:#BBDEF6;border-bottom:1px solid#A67901;border-top:1px solid #FFF;border-left:1px solid#FFF;color:#000;height:25px;line-height:25px;text-indent:5px;}#msg_content{margin:5px;margin-right:0;width:230px;height:126px;overflo w:hidden;}</style><!-- 浮动窗口样式css end -->二．在需要添加浮动窗口的页面的head中添加js代码，代码如下：window.onload=function(){setTimeout('refresh10()',1000*60*10) ;}function refresh10(){window.location.reload();}三．在需要添加浮动窗口的页面的尾部添加js代码，代码如下：<!-- 浮动窗口js，必须要放置到最后begin--><script language="javascript">var Message={set: function() {//最小化与恢复状态切换var set=this.minbtn.status == 1?[0,1,'block',this.char[0],'最小化']:[1,0,'none',this.char[1],'展开'];this.minbtn.status=set[0];this.win.style.borderBottomWidth=set[1];this.content.style.display =set[2];this.minbtn.innerHTML =set[3]this.minbtn.title = set[4];this.win.style.top = this.getY().top;},close: function() {//关闭this.win.style.display = 'none';window.onscroll = null;},setOpacity: function(x) {//设置透明度var v = x >= 100 ? '': 'Alpha(opacity=' + x + ')';this.win.style.visibility = x<=0?'hidden':'visible';//IE有绝对或相对定位内容不随父透明度变化的bugthis.win.style.filter = v;this.win.style.opacity = x / 100;},show: function() {//渐显clearInterval(this.timer2);var me = this,fx = this.fx(0, 100, 0.1),t = 0;this.timer2 = setInterval(function() {t = fx();me.setOpacity(t[0]);if (t[1] == 0) {clearInterval(me.timer2) }},10);},fx: function(a, b, c) {//缓冲计算var cMath = Math[(a - b) > 0 ? "floor": "ceil"],c = c || 0.1;return function() {return [a += cMath((b - a) * c), a - b]}},getY: function() {//计算移动坐标var d = document,b = document.body, e = document.documentElement;var s = Math.max(b.scrollTop, e.scrollTop);var h =/BackCompat/i.test(patMode)?b.clientHeight:e.clientHeight;var h2 = this.win.offsetHeight;return {foot: s + h + h2 + 2+'px',top: s + h - h2 - 2+'px'}},moveTo: function(y) {//移动动画clearInterval(this.timer);var me = this,a = parseInt(this.win.style.top)||0;var fx = this.fx(a, parseInt(y));var t = 0 ;this.timer = setInterval(function() {t = fx();me.win.style.top = t[0]+'px';if (t[1] == 0) {clearInterval(me.timer);me.bind();}},10);},bind:function (){//绑定窗口滚动条与大小变化事件var me=this,st,rt;window.onscroll = function() {clearTimeout(st);clearTimeout(me.timer2);me.setOpacity(0);st = setTimeout(function() {me.win.style.top = me.getY().top;me.show();},600);};window.onresize = function (){clearTimeout(rt);rt = setTimeout(function() {me.win.style.top = me.getY().top},100);}},init: function() {//创建HTMLfunction $(id) {return document.getElementById(id)};this.win=$('msg_win');var set={minbtn: 'msg_min',closebtn: 'msg_close',title:'msg_title',content: 'msg_content'};for (var Id in set) {this[Id] = $(set[Id])};var me = this;this.minbtn.onclick = function() {me.set();this.blur()};this.closebtn.onclick = function() {me.close()};this.char=erAgent.toLowerCase().indexOf('firefox')+1?['_','::','×']:['0','2','r'];//FF不支持webdings字体this.minbtn.innerHTML=this.char[0];this.closebtn.innerHTML=this.char[2];setTimeout(function() {//初始化最先位置me.win.style.display = 'block';me.win.style.top = me.getY().foot;me.moveTo(me.getY().top);},0);return this;}};Message.init();</script><!-- 浮动窗口js end-->四．Body部分添加浮动床的代码，代码如下：<!-- 浮动窗口html代码begin --><hr><div id="msg_win"style="display:block;top:490px;visibility:visible;opacity:1;"> <div class="icos"><a id="msg_min"title="最小化"href="javascript:void0">_</a><a id="msg_close"title="关闭"href="javascript:void 0">×</a></div><div id="msg_title">设备运行情况--></div><div id="msg_content"style="overflow:auto;height:150px;width:100%;white-s pace:nowrap"><s:property value="devRun"escape="false"/>（自己要显示的内容）</div></div><!-- 浮动窗口html代码end -->。
经常上网的朋友可能会到过这样一些网站，一进入首页立刻会弹出一个窗口，或者按一个连接或按钮弹出，通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。
其实制作这样的页面效果非常的容易，只要往该页面的HTML里加入几段javascript代码即可实现。
下面俺就带您剖析它的奥秘。
【1、最基本的弹出窗口代码】其实代码非常简单：<SCRIPT LANGUAGE=”javascript”><!–window.open (‘page.html’)–></SCRIPT>因为着是一段javascripts代码，所以它们应该放在<SCRIPT LANGUAGE=”javascr ipt”>标签和</script>之间。
<!–和–>是对一些版本低的浏览器起作用，在这些老浏览器中不会将标签中的代码作为文本显示出来。
要养成这个好习惯啊。
window.open (‘page.html’) 用于控制弹出新的窗口page.html，如果page.html 不与主窗口在同一路径下，前面应写明路径，绝对路径(http://)和相对路径(.. /)均可。
用单引号和双引号都可以，只是不要混用。
这一段代码可以加入HTML的任意位置，<head>和</head>之间可以，<body>间</b ody>也可以，越前越早执行，尤其是页面代码长，又想使页面早点弹出就尽量往前放。
【2、经过设置后的弹出窗口】下面再说一说弹出窗口的设置。
只要再往上面的代码中加一点东西就可以了。
我们来定制这个弹出的窗口的外观，尺寸大小，弹出的位置以适应该页面的具体情况。
<SCRIPT LANGUAGE=”javascript”><!–window.open (‘page.html’, ‘newwindow’, ‘height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no’)//写成一行–></SCRIPT>参数解释：<SCRIPT LANGUAGE=”javascript”> js脚本开始；window.open 弹出新窗口的命令；‘page.html’弹出窗口的文件名；‘newwindow’弹出窗口的名字（不是文件名），非必须，可用空”代替；height=100 窗口高度；width=400 窗口宽度；top=0 窗口距离屏幕上方的象素值；left=0 窗口距离屏幕左侧的象素值；toolbar=no 是否显示工具栏，yes为显示；menubar，scrollbars 表示菜单栏和滚动栏。
javascript弹出和关闭网页窗口代码大全javascript弹出和关闭网页窗口代码大全//关闭,父窗口和子窗口都不弹出对话框,直接关闭this.Response.Write("<script> ");this.Response.Write("{top.opener =null;top.close();}");this.Response.Write("</script> ");//关闭,父窗口弹出对话框,子窗口直接关闭this.Response.Write("<script language=javascript> window.close();</script> ");//弹出窗口刷新当前页面width=200 height=200菜单。
菜单栏,工具条,地址栏,状态栏全没有this.Response.Write("<script language=javascript> window.open('rows.aspx','newwindow','width=200,height=200') </script> ");//弹出窗口刷新当前页面this.Response.Write("<script language=javascript> window.open('rows.aspx')</script> ");this.Response.Write("<script>window.open('WebForm2.aspx','_blank');</script> ");//弹出提示窗口跳到webform2.aspx页(在一个IE窗口中)this.Response.Write(" <script language=javascript> alert('注册成功');window.window.location.href='WebForm2.aspx';</script> ");//关闭当前子窗口,刷新父窗口this.Response.Write("<script>window.opener.location.href=window.opener.location.href;wind ow.close();</script> ");this.Response.Write("<script>window.opener.location.replace(window.opener.document.referr er);window.close();</script> ");//子窗口刷新父窗口this.Response.Write("<script>window.opener.location.href=window.opener.location.href;</scri pt> ");this.Response.Write("<script>window.opener.location.href='WebForm1.aspx';</script> ");//弹出提示窗口.确定后弹出子窗口(WebForm2.aspx)this.Response.Write("<script language='javascript'> alert('发表成功！');window.open('WebForm2.aspx')</script> ");//弹出提示窗口,确定后,刷新父窗口this.Response.Write("<script> alert('发表成功！');window.opener.location.href=window.opener.location.href;</s cript> ");//弹出相同的一页<INPUT type="button" value="Button" onclick="javascript:window.open(window.location.href)">//Response.Write("parent.mainFrameBottom.location.href='y ourwebform.aspx?temp=" +str+"';");<SCRIPT LANGUAGE="javascript"><!--window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no') //这句要写成一行--></SCRIPT>参数解释：<SCRIPT LANGUAGE="javascript"> js脚本开始；window.open 弹出新窗口的命令；'page.html' 弹出窗口的文件名；'newwindow' 弹出窗口的名字（不是文件名），非必须，可用空''代替；height=100 窗口高度；width=400 窗口宽度；top=0 窗口距离屏幕上方的象素值；left=0 窗口距离屏幕左侧的象素值；toolbar=no 是否显示工具栏，yes为显示；menubar，scrollbars 表示菜单栏和滚动栏。
javascript弹出窗⼝代码⼤全如何利⽤⽹页弹出各种形式的窗⼝，我想⼤家⼤多都是知道些的，但那种多种多样的弹出式窗⼝是怎么搞出来的，今天找了⼀篇好⽂学习了： 1.弹启⼀个全屏窗⼝<html><body onload="window.open('','example01','fullscreen');">;<b></b></body></html> 2.弹启⼀个被F11化后的窗⼝<html><body onload="window.open(''','example02','channelmode');">;<b></b></body></html> 3.弹启⼀个带有收藏链接⼯具栏的窗⼝<html><body onload="window.open('','example03','width=400,height=300,directories');"><b></b></body></html> 4.⽹页对话框<html><SCRIPT LANGUAGE="javascript"><!--showModalDialog(','example04','dialogWidth:400px;dialogHeight:300px;dialogLeft:200px;dialogTop:150px;center:yes;help:yes;resizable:yes;status:yes')//--></SCRIPT><b></b></body></html><html><SCRIPT LANGUAGE="javascript"><!--showModelessDialog(','example05','dialogWidth:400px;dialogHeight:300px;dialogLeft:200px;dialogTop:150px;center:yes;help:yes;resizable:yes;status:yes')//--></SCRIPT><b></b></body></html> showModalDialog()或是showModelessDialog() 来调⽤⽹页对话框，⾄于showModalDialog()与showModelessDialog()的区别，在于showModalDialog()打开的窗⼝（简称模式窗⼝），置在⽗窗⼝上，必须关闭才能访问⽗窗⼝(建议尽量少⽤，以免招⼈反感)；showModelessDialog()dialogHeight: iHeight 设置对话框窗⼝的⾼度。
Javascript弹窗代码大全(收集)Javascript弹窗代码大全(收集)2007年08月27日星期一 20:56以下包括强制弹窗 24小时IP弹窗延时弹窗退弹等我们使用cookie来控制一下就可以了。
首先，将如下代码加入主页面html的<head>区：<script>function openwin(){window.open(”page.html”,”",”width=200,height=200″)}function get_cookie(name){var search = name + “=”var returnvalue = “”;if (documents.cookie.length > 0) {offset = documents.cookie.indexof(search)if (offset != -1) {offset += search.lengthend = documents.cookie.indexof(”;”, offset);if (end == -1)end = documents.cookie.length;returnvalue=”/unescape(documents.cookie.substring(offset,end))”}}return returnvalue;}function loadpopup(){if (get_cookie(’popped’)==”){openwin()documents.cookie=”popped=yes”}}</script>然后，用<body onload=”loadpopup()”>（注意不是openwin而是loadpop啊！）替换主页面中原有的<body>这一句即可。
你可以试着刷新一下这个页面或重新进入该页面，窗口再也不会弹出了。
js实现右下⾓提⽰框的⽅法本⽂实例讲述了js实现右下⾓提⽰框的⽅法。
分享给⼤家供⼤家参考。
具体实现⽅法如下：实现右下⾓提⽰框的Jquery插件（popup.js）复制代码代码如下://兼容ie6的fixed代码//jQuery(function($j){// $j('#pop').positionFixed()//})(function($j){$j.positionFixed = function(el){$j(el).each(function(){new fixed(this)})return el;}$j.fn.positionFixed = function(){return $j.positionFixed(this)}var fixed = $j.positionFixed.impl = function(el){var o=this;o.sts={target : $j(el).css('position','fixed'),container : $j(window)}o.sts.currentCss = {top : o.sts.target.css('top'),right : o.sts.target.css('right'),bottom : o.sts.target.css('bottom'),left : o.sts.target.css('left')}if(!o.ie6)return;o.bindEvent();}$j.extend(fixed.prototype,{ie6 : $.browser.msie && $.browser.version < 7.0,bindEvent : function(){var o=this;o.sts.target.css('position','absolute')o.overRelative().initBasePos();o.sts.target.css(o.sts.basePos)o.sts.container.scroll(o.scrollEvent()).resize(o.resizeEvent());o.setPos();},overRelative : function(){var o=this;var relative = o.sts.target.parents().filter(function(){if($j(this).css('position')=='relative')return this;})if(relative.size()>0)relative.after(o.sts.target)return o;},initBasePos : function(){var o=this;o.sts.basePos = {top: o.sts.target.offset().top - (o.sts.currentCss.top=='auto'?o.sts.container.scrollTop():0), left: o.sts.target.offset().left - (o.sts.currentCss.left=='auto'?o.sts.container.scrollLeft():0) }return o;},setPos : function(){var o=this;o.sts.target.css({top: o.sts.container.scrollTop() + o.sts.basePos.top,left: o.sts.container.scrollLeft() + o.sts.basePos.left})},scrollEvent : function(){var o=this;return function(){o.setPos();}},resizeEvent : function(){var o=this;return function(){setTimeout(function(){o.sts.target.css(o.sts.currentCss)o.initBasePos();o.setPos()},1)}}})})(jQuery)jQuery(function($j){$j('#footer').positionFixed()})//pop右下⾓弹窗函数function Pop(title,url,intro){this.title=title;this.url=url;this.intro=intro;this.apearTime=1000;this.hideTime=500;this.delay=10000;//添加信息this.addInfo();//显⽰this.showDiv();//关闭this.closeDiv();}Pop.prototype={addInfo:function(){$("#popTitle a").attr('href',this.url).html(this.title);$("#popIntro").html(this.intro);$("#popMore a").attr('href',this.url);},showDiv:function(time){if (!($.browser.msie && ($.browser.version == "6.0") && !$.support.style)) { $('#pop').slideDown(this.apearTime).delay(this.delay).fadeOut(400);;} else{//调⽤jquery.fixed.js,解决ie6不能⽤fixed$('#pop').show();jQuery(function($j){$j('#pop').positionFixed()})}},closeDiv:function(){$("#popClose").click(function(){$('#pop').hide();});}}右下⾓提⽰框实例复制代码代码如下:<!DOCTYPE HTML><html><head><meta charset="UTF-8"><title>jquery右下⾓pop弹窗</title></head><body><h2>请看浏览器有下⾓</h2><!--jquery右下⾓pop弹窗start --><script type="text/javascript" >window.onload=function(){var pop=new Pop("这⾥是标题，哈哈","URL超链接","请输⼊你的内容简介，这⾥是内容简介.请输⼊你的内容简介，这⾥是内容简介.请输⼊你的内容简介，这⾥是内容简介");}</script><script type="text/javascript" src="jquery.min.js"></script><script type="text/javascript" src="popup.js"></script><div id="pop" style="display:none;"><style type="text/css">*{}{margin:0;padding:0;}#pop{}{background:#fff;width:260px;border:1px solid #e0e0e0;font-size:12px;position: fixed;right:10px;bottom:10px;}#popHead{}{line-height:32px;background:#f6f0f3;border-bottom:1px solid #e0e0e0;position:relative;font-size:12px;padding:0 0 0 10px;}#popHead h2{}{font-size:14px;color:#666;line-height:32px;height:32px;}#popHead #popClose{}{position:absolute;right:10px;top:1px;}#popHead a#popClose:hover{}{color:#f00;cursor:pointer;}#popContent{}{padding:5px 10px;}#popTitle a{}{line-height:24px;font-size:14px;font-family:'微软雅⿊';color:#333;font-weight:bold;text-decoration:none;}#popTitle a:hover{}{color:#f60;}#popIntro{}{text-indent:24px;line-height:160%;margin:5px 0;color:#666;}#popMore{}{text-align:right;border-top:1px dotted #ccc;line-height:24px;margin:8px 0 0 0;}#popMore a{}{color:#f60;}#popMore a:hover{}{color:#f00;}</style><div id="popHead"><a id="popClose" title="关闭">关闭</a><h2>温馨提⽰</h2></div><div id="popContent"><dl><dt id="popTitle">这⾥是标题</dt><dd id="popIntro">这⾥是内容简介</dd></dl><p id="popMore">查看 »</p></div></div><!--右下⾓pop弹窗 end--><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>jquery右下⾓弹窗</body></html>希望本⽂所述对⼤家的javascript程序设计有所帮助。
JS右下⾓⼴告窗⼝代码（可收缩、展开及关闭）本⽂实例讲述了JS右下⾓⼴告窗⼝代码。
分享给⼤家供⼤家参考。
具体如下：这是⼀款右下⾓窗⼝JS代码，完美的右下⾓，仿新浪博客的右个⾓弹出窗⼝，这款Javascript代码在兼容性和操作舒适度⽅⾯做的相当不错。
调⽤了⼏张外部的图⽚，使⽤时⾃⾏下载吧。
运⾏效果截图如下：在线演⽰地址如下：具体代码如下：<!DOCTYPE html PUBLIC "-//W3C//h2D XHTML 1.0 Transitional//EN""/TR/xhtml1/h2D/xhtml1-transitional.h2d"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style>* { padding: 0; margin: 0; }li { list-style: none; }body { background: #eee; }.float_layer { width: 300px; border: 1px solid #aaaaaa; display:none; background: #fff; }.float_layer h2 { height: 25px; line-height: 25px; padding-left: 10px; font-size: 14px; color: #333; background: url(images/title_bg.gif) repeat-x; border-bottom: 1px solid #aaaaaa; position: relative; }.float_layer .min { width: 21px; height: 20px; background: url(images/min.gif) no-repeat 0 bottom; position: absolute; top: 2px; right: 25px; }.float_layer .min:hover { background: url(images/min.gif) no-repeat 0 0; }.float_layer .max { width: 21px; height: 20px; background: url(images/max.gif) no-repeat 0 bottom; position: absolute; top: 2px; right: 25px; }.float_layer .max:hover { background: url(images/max.gif) no-repeat 0 0; }.float_layer .close { width: 21px; height: 20px; background: url(images/close.gif) no-repeat 0 bottom; position: absolute; top: 2px; right: 3px; }.float_layer .close:hover { background: url(images/close.gif) no-repeat 0 0; }.float_layer .content { height: 160px; overflow: hidden; font-size: 14px; line-height: 18px; color: #666; text-indent: 28px; }.float_layer .wrap { padding: 10px; }</style><script type="text/javascript">function miaovAddEvent(oEle, sEventName, fnHandler){if(oEle.attachEvent){oEle.attachEvent('on'+sEventName, fnHandler);}else{oEle.addEventListener(sEventName, fnHandler, false);}}window.onload = function(){var oDiv=document.getElementById('miaov_float_layer');var oBtnMin=document.getElementById('btn_min');var oBtnClose=document.getElementById('btn_close');var oDivContent=oDiv.getElementsByTagName('div')[0];var iMaxHeight=0;var isIE6=erAgent.match(/MSIE 6/ig) && !erAgent.match(/MSIE 7|8/ig);oDiv.style.display='block';iMaxHeight=oDivContent.offsetHeight;if(isIE6){oDiv.style.position='absolute';repositionAbsolute();miaovAddEvent(window, 'scroll', repositionAbsolute);miaovAddEvent(window, 'resize', repositionAbsolute);}else{oDiv.style.position='fixed';repositionFixed();miaovAddEvent(window, 'resize', repositionFixed);}oBtnMin.timer=null;oBtnMin.isMax=true;oBtnMin.onclick=function (){startMove(oDivContent, (this.isMax=!this.isMax)?iMaxHeight:0,function (){oBtnMin.className=oBtnMin.className=='min'?'max':'min';});};oBtnClose.onclick=function (){oDiv.style.display='none';};};function startMove(obj, iTarget, fnCallBackEnd){if(obj.timer){clearInterval(obj.timer);}obj.timer=setInterval(function (){doMove(obj, iTarget, fnCallBackEnd);},30);}function doMove(obj, iTarget, fnCallBackEnd){var iSpeed=(iTarget-obj.offsetHeight)/8;if(obj.offsetHeight==iTarget){clearInterval(obj.timer);obj.timer=null;if(fnCallBackEnd){fnCallBackEnd();}}else{iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);obj.style.height=obj.offsetHeight+iSpeed+'px';((erAgent.match(/MSIE 6/ig) && erAgent.match(/MSIE 6/ig).length==2)?repositionAbsolute:repositionFixed)()}}function repositionAbsolute(){var oDiv=document.getElementById('miaov_float_layer');var left=document.body.scrollLeft||document.documentElement.scrollLeft;var top=document.body.scrollTop||document.documentElement.scrollTop;var width=document.documentElement.clientWidth;var height=document.documentElement.clientHeight;oDiv.style.left=left+width-oDiv.offsetWidth+'px';oDiv.style.top=top+height-oDiv.offsetHeight+'px';}function repositionFixed(){var oDiv=document.getElementById('miaov_float_layer');var width=document.documentElement.clientWidth;var height=document.documentElement.clientHeight;oDiv.style.left=width-oDiv.offsetWidth+'px';oDiv.style.top=height-oDiv.offsetHeight+'px';}</script></head><body style="height: 2200px"><div class="float_layer" id="miaov_float_layer"><h2><strong>这是标题</strong><a id="btn_min" href="javascript:;" class="min"></a><a id="btn_close" href="javascript:;" class="close"></a></h2><div class="content"><div class="wrap">这⾥放置的是⼴告信息，你可以填⼊任何的⼴告内容，⽐如像这样：<strong>是国内专业的⽹站建设资源、脚本编程学习类⽹站，提供asp、php、、javascript、jquery、vbscript、dos批处理、⽹页制作、⽹络编程、⽹站建设等编程资料</strong>脚本特效下 </div></div></div></body></html>希望本⽂所述对⼤家的javascript程序设计有所帮助。
经常上网的朋友可能会到过这样一些网站，一进入首页立刻会弹出一个窗口，或者按一个连接或按钮弹出，通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。
其实制作这样的页面效果非常的容易，只要往该页面的html里加入几段javascript代码即可实现。
下面俺就带您剖析它的奥秘。
【1、最基本的弹出窗口代码】其实代码非常简单：<script language="javascript"><!--window.open ('page.html')--></script>因为着是一段javascripts代码，所以它们应该放在<script language="javascript">标签和</script>之间。
<!-- 和-->是对一些版本低的浏览器起作用，在这些老浏览器中不会将标签中的代码作为文本显示出来。
要养成这个好习惯啊。
window.open ('page.html') 用于控制弹出新的窗口page.html，如果page.html不与主窗口在同一路径下，前面应写明路径，绝对路径(http://)和相对路径(../)均可。
用单引号和双引号都可以，只是不要混用。
这一段代码可以加入html的任意位置，<head>和</head>之间可以，<body>间</body>也可以，越前越早执行，尤其是页面代码长，又想使页面早点弹出就尽量往前放。
【2、经过设置后的弹出窗口】下面再说一说弹出窗口的设置。
只要再往上面的代码中加一点东西就可以了。
我们来定制这个弹出的窗口的外观，尺寸大小，弹出的位置以适应该页面的具体情况。
<script language="javascript"><!--window.open ('page.html', 'newwindow', 'height=100, width=400, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no')//写成一行--></script>参数解释：<script language="javascript"> js脚本开始；window.open 弹出新窗口的命令；'page.html' 弹出窗口的文件名；'newwindow' 弹出窗口的名字（不是文件名），非必须，可用空''代替；height=100 窗口高度；width=400 窗口宽度；top=0 窗口距离屏幕上方的象素值；left=0 窗口距离屏幕左侧的象素值；toolbar=no 是否显示工具栏，yes为显示；menubar，scrollbars 表示菜单栏和滚动栏。
JavaScript弹出窗⼝⽅法汇总本⽂实例汇总了常⽤的JavaScript弹出窗⼝⽅法，供⼤家对⽐参考，希望能对⼤家有所帮助。
详细⽅法如下：1.⽆提⽰刷新⽹页：⼤家有没有发现，有些⽹页，刷新的时候，会弹出⼀个提⽰窗⼝，点“确定”才会刷新。
⽽有的页⾯不会提⽰，不弹出提⽰窗⼝，直接就刷新了.如果页⾯没有form,则不会弹出提⽰窗⼝如果页⾯有form表单，a)<form method="post" ...>会弹出提⽰窗⼝b)<form method="get" ...>不会弹出2. javascript刷新页⾯的⽅法：window.location.reload();使⽤window.open()弹出的弹出窗⼝，刷新⽗窗⼝window.opener.location.reload()使⽤window.showDialog弹出的模式窗⼝window.dialogArguments.location.reload();3.javascript弹出窗⼝代码：window.open()⽅式：window.open()⽀持环境： JavaScript1.0+/JScript1.0+/Nav2+/IE3+/Opera3+基本语法：window.open(pageURL,name,parameters)其中：pageURL 为⼦窗⼝路径name 为⼦窗⼝句柄parameters 为窗⼝参数(各参数⽤逗号分隔)⽰例：<SCRIPT><!--window.open ('page.html','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no') //写成⼀⾏--></SCRIPT>脚本运⾏后，page.html将在新窗体newwindow中打开，宽为100，⾼为400，距屏顶0象素，屏左0象素，⽆⼯具条，⽆菜单条，⽆滚动条，不可调整⼤⼩，⽆地址栏，⽆状态栏。
⽹页弹出窗⼝代码全攻略经常上⽹的朋友可能会到过这样⼀些⽹站，⼀进⼊⾸页⽴刻会弹出⼀个窗⼝，或者按⼀个连接或按钮弹出，通常在 这个窗⼝⾥会显⽰⼀些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提⽰的信息。
其实制作这样的页⾯效果⾮常的容易，只要往该页⾯的HTML⾥加⼊⼏段Javascript代码即可实现。
下⾯俺就带您剖析它的奥秘。
1、【最基本的弹出窗⼝代码】--------------------------------------------------------------------------------其实代码⾮常简单：<SCRIPT LANGUAGE="javascript"><!--window.open ('page.html')--></SCRIPT> 因为这是⼀段javascripts代码，所以它们应该放在<SCRIPT LANGUAGE="javascript">标签和</script>之间。
<!-- 和 -->是对⼀些版本低的浏览器起作⽤，在这些⽼浏览器中不会将标签中的代码作为⽂本显⽰出来。
要养成这个好习惯啊。
window.open ('page.html') ⽤于控制弹出新的窗⼝page.html，如果page.html不与主窗⼝在同⼀路径下，前⾯应写明路径，绝对路径(http://)和相对路径(../)均可。
⽤单引号和双引号都可以，只是不要混⽤。
这⼀段代码可以加⼊HTML的任意位置，<head>和</head>之间可以，<body>间</body>也可以，越前越早执⾏，尤其是页⾯代码长，⼜想使页⾯早点弹出就尽量往前放。
2、【经过设置后的弹出窗⼝】-------------------------------------------------------------------------------- 下⾯再说⼀说弹出窗⼝的设置。
详解JavaScript实现JS弹窗的三种⽅式⽬录⼀、前⾔⼆、什么是JavaScript，有什么⽤?三、HTML嵌⼊JavaScript的⽅式：第⼀种⽅式：第⼆种⽅式：第三种⽅式：总结⼀、前⾔html和css的学习⼤致完成，我们进⼊重要的JavaScript学习阶段⼆、什么是JavaScript，有什么⽤?Javascript是运⾏在浏览器上的脚本语⾔。
简称JS。
他的出现让原来静态的页⾯动起来了，更加的⽣动。
三、HTML嵌⼊JavaScript的⽅式：第⼀种⽅式：1、要实现的功能:⽤户点击以下按钮，弹出消息框。
2、弹窗JS是⼀门事件驱动型的编程语⾔，依靠事件去驱动，然后执⾏对应的程序。
在JS中有很多事件，其中有⼀个事件叫做:⿏标单击，单词:click。
并且任何事件都会对应⼀个事件句柄叫做:onclick。
【注意:事件和事件句柄的区别是:事件句柄是在事件单词前添加⼀个on。
】，⽽事件句柄是以HTML标签的属性存在的。
3、οnclick=js代码"，执⾏原理是什么?页⾯打开的时候，js代码并不会执⾏，只是把这段ss代码注册到按钮的click事件上了。
等这个按钮发⽣click事件之后，注册在onclick后⾯的js代码会被浏览器⾃动调⽤。
4、怎么使⽤JS代码弹出消息框?在JS中有⼀个内置的对象叫做window, 全部⼩写，可以直接拿来使⽤，window代表的是浏览器对象。
window对象有⼀个函数叫做:alert，⽤法是:window.alert("消息");这样就可以弹窗了。
5、window.可以省略下⾯两个等价<input type="button" value="hello" onclick="window.alert('hello world')"/><input type="button" value="hello" onclick="alert('hello world')"/>6、设置多个alert可以⼀直弹窗<input type="button" value="hello" onclick="alert(hello java")alert(hello python')alert('hello javaScript!)"/>JS中的字符串可以使⽤双引号，也可以使⽤单引号。
