对联 ·故事 ·史海钩沉 ·人物档案 ·地方风俗 ·谚语大全 ·讽刺与幽默 · 赚钱 · 法律 · 在线教研 · 会员中心 · 心理测试 · 魔鬼词典 · 顺口溜
 
主页特效 网页特效 百家姓
娱乐 歇后语 绕口令 脑筋急转弯
 
谚语 谜语 名言 邮政编码
便民 酒方 验方 偏方 站长工具  
 
算命 风俗 手相 爱情
女孩 音乐 面相 星座 血型
 
饮食 穴道 偏方 医药
生活 软件 硬件 解梦 高考



   JS特效



实用工具
便民服务 加密解密
 
魅力高密 民间故事 Flash教程 PS教程 最新国内新闻
新华字典 黄道吉日 英语园地  万年历 Html2anycode
  首页 | 美图 | 短信 | 安全 | 校园 | 网站 | 游戏 | UFO | 文秘 | 生活 | 信息技术 | 论文 | 人生 | 情感 | 日记
返回首页
当前位置: 主页 > 网站建设 >

html页面中弹出固定大小的窗口的方法

时间:2009-12-29 00:04来源:未知 作者:葫芦 点击:
方法1:弹出固定大小的窗口,居中显示:
  

方法1:弹出固定大小的窗口,居中显示:

<script>
///弹出窗口(并居中)
    function openWin(theURL,winName,features, myWidth, myHeight, isCenter){
    if(window.screen)if(isCenter)if(isCenter=="true"){
        var myLeft = (screen.width-myWidth)/2;
        var myTop = (screen.height-myHeight)/2;
        features+=(features!='')?',':'';     
            features+=',left='+myLeft+',top='+myTop;
    }
      window.open(theURL,winName,features+((features!='')?',':'')+'width='+myWidth+',height='+myHeight);
  }

 

单击下面的“盼盼的家园”这几个字可以进行测试:
<a href="#" onclick="openWin('http://www.panpan.org','','',400,400,'true')">盼盼的家园</a>

 


方法2:

<script language="javascript">
function pop1(url) {
var
newwin=window.open

(url,"","toolbar=no,location=no,top=200,left=300,directories=no,center:yes;status=yes,menubar=no,scrollbars=no,resizable=no

width=550,height=350");
// newwin.focus();
return false;
}
</script>
<body>
<a href="http://www.panpan.org" onmouseover="return pop1(this.href);">盼盼的家园</a>
</body>

说明:onmouseover是可以任意设置的,你是可以自己定义鼠标状态的。
如果你想增加一个弹出窗口的设置,只需将以上JAVASCRIPT参数复制一次就可以了。
注意将function pop1(url)里面的POP1改一个名称就行,在onmouseover="return pop1(this.href)中也要做相应的修改。

 


方法3:

我们来定制这个弹出的窗口的外观,尺寸大小,弹出的位置以适应该页面的具体情况。
<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 表示菜单栏和滚动栏。
resizable=no 是否允许改变窗口大小,yes为允许;
location=no 是否显示地址栏,yes为允许;
status=no 是否显示状态栏内的信息(通常是文件已经打开),yes为允许;
</SCRIPT> js脚本结束

 

方法4:用函数控制弹出窗口

下面是一个完整的代码。
<html>
<head>
<script LANGUAGE="JavaScript">
<!--
function openwin() {
window.open ("page.html", "newwindow", "height=100, width=400, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
//写成一行
}
//-->
</script>
</head>
<body onload="openwin()">
...任意的页面内容...
</body>
</html>


这里定义了一个函数openwin(),函数内容就是打开一个窗口。在调用它之前没有任何用途。
怎么调用呢?


方法一:<body onload="openwin()"> 浏览器读页面时弹出窗口;
方法二:<body onunload="openwin()"> 浏览器离开页面时弹出窗口;
方法三:用一个连接调用:
<a href="#" onclick="openwin()">打开一个窗口</a>
注意:使用的“#”是虚连接。
方法四:用一个按钮调用:
<input type="button" onclick="openwin()" value="打开窗口">

 

 

方法5:同时弹出2个窗口

对源代码稍微改动一下:
<script LANGUAGE="JavaScript">
<!--
function openwin() {
window.open ("page.html", "newwindow", "height=100, width=100, top=0, left=0,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
//写成一行
window.open ("page2.html", "newwindow2", "height=100, width=100, top=100, left=100,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
//写成一行
}
//-->
</script>


为避免弹出的2个窗口覆盖,用top和left控制一下弹出的位置不要相互覆盖即可。最后用上面说过的四种方法调用即可。
注意:2个窗口的name(newwindows和newwindow2)不要相同,或者干脆全部为空。

 

 

方法6:主窗口打开文件1.htm,同时弹出小窗口page.html

如下代码加入主窗口<head>区:
<script language="javascript">
<!--
function openwin() {
window.open("page.html","","width=200,height=200")
}
//-->
</script>
加入<body>区:
<a href="http://www.panpan.org/" onclick="openwin()">进入我的网站</a>即可。

 


关于弹窗的内容就说到这里了。

 

顶一下
(1)
100%
踩一下
(0)
0%
------分隔线----------------------------
最新评论 查看所有评论
发表评论 查看所有评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 密码: 验证码:
赞助商位置
推荐内容
杂七杂八