弹出居中新窗口,代码如下:
<html>
<head>
<title>JS弹出窗口介绍</title>
</head>
<script language="javascript" type="text/javascript">
function OpenWindow(htmUrl)
{
var url=htmUrl;
var winName="newWin";
var awidth=screen.availWidth/6*2; //窗口宽度,需要设置
var aheight=screen.availHeight/5*2; //窗口高度,需要设置
var atop=(screen.availHeight - aheight)/2; //窗口顶部位置,一般不需要改
var aleft=(screen.availWidth - awidth)/2; //窗口放中央,一般不需要改
var param0="scrollbars=0,status=0,menubar=0,resizable=no,location=0"; //新窗口的参数
var params="top=" + atop + ",left=" + aleft + ",width=" + awidth + ",height=" + aheight + "," + param0 ;
win=window.open(url,winName,params); //打开新窗口
win.focus(); //新窗口获得焦点
}
</script>
<body>
<div>
<a href="OpenWindow('TestPage.html')">点击弹出居中显示窗口</a>
</div>
</body>
</html>
参数解释:
window.open('1.新窗口的url','2.弹出窗口的名字非必填','3.新窗口的外观参数')弹出新窗口的命令及需要的参数;
height 窗口高度;
width 窗口宽度;
top=窗口距离屏幕上方的象素值;
left 窗口距离屏幕左侧的象素值;
toolbar=no 是否显示工具栏,yes为显示;
menubar,scrollbars 表示菜单栏和滚动栏。
resizable=no 是否允许改变窗口大小,yes为允许;
location=no 是否显示地址栏,yes为允许;
status=no 是否显示状态栏内的信息,yes为允许;
弹出模态窗口,代码如下:
<html>
<head>
<title>JS弹出模态窗口介绍</title>
</head>
<script language="javascript" type="text/javascript">
function OpenDialog(url,width,height)
{
var params = "dialogWidth:"+ width +"px;dialogHeight:"+ height +"px;center:yes;status:no;help:no";
showModalDialog(url,window,params);
}
</script>
<body>
<div>
<a href="OpenDialog('TestPage.html',400,350)">点击弹出模态窗口</a>
</div>
</body>
</html>
参数解释:
dialogHeight: iHeight 设置对话框窗口的高度。
dialogWidth: iWidth 设置对话框窗口的宽度。
dialogLeft: iXPos 设置对话框窗口相对于桌面左上角的left位置。
dialogTop: iYPos 设置对话框窗口相对于桌面左上角的top位置。
center: {yes | no | 1 | 0 } 指定是否将对话框在桌面上居中,默认值是“yes”。
help: {yes | no | 1 | 0 } 指定对话框窗口中是否显示上下文敏感的帮助图标。默认值是“yes”。
resizable: {yes | no | 1 | 0 } 指定是否对话框窗口大小可变。默认值是“no”。
status: {yes | no | 1 | 0 } 指定对话框窗口是否显示状态栏。对于非模式对话框窗口,默认值是“yes”;对于模式对话框窗口,默认值是 “no”。