新浪首页免费邮件用户注册网站地图
上移动梦网
赢手机大奖

新浪首页 > 科技时代 > 网上学园 > 主页制作 > 正文
网页新建窗口制作全攻略

http://www.sina.com.cn 2001/09/03 11:09 赛迪网 唐剑光

  在浏览或制作网页过程中经常用到新建浏览窗口。而新建窗口也有很多种变换方式,只要我们合理使用,可以让自己制作的网页更酷,下面让我们来看一看。

  自动弹出窗口

  在浏览一些网站时,我们常见到在打开首页文件的同时,会自动弹出另外一个窗口网
页,这个网页一般都是一些公告、广告类的内容,它是怎样做出来的呢?实际上这些都是JavaScript代码的功劳。

  1.源代码介绍

  笔者将介绍实现自动弹出窗口的两种方法,都是调用window.open()实现的,它们的显示效果相同。

  方法一代码如下:

  <script language="JavaScript">

  <!--

  window.open("XXX.htm", "NewWindow","toolbar =no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no,copyhistory=no,width=400,height=260,left=10,top=340")

  //-->

  </script>

  其中XXX.htm是你要在新窗口中打开的网页文件名。

  方法二代码如下:

  <script language="JavaScript">

  <!--

  var gt=unescape('%3e');

  var popup=null;

  var over="Launch Pop-up Navigator";

  popup=window.open('', 'popupnav','width=400,height=250,left=10,top=340,toolbar=0,location=0,directories=0,status=0,resizable=0,scrollbars=0');

  if(popup!=null){

  if (popup.opener==null){

  popup.opener=self;

  }

  popup.location.href='XXX.htm';

  }

  //-->

  </script>

  2.参数解释

  1)弹出窗口的浏览器界面设置参数如下:

名称 说明 备注
toolbar=yes 显示工具条 1.它们的值可以是yes 或no,也可以是1和0(除0以外,其它的数都算1);2.上述参数如果在程序代码中没有出现,缺省 都是禁止显示。
location=yes 显示网址栏
directories=yes 导航条,即显示“链接”栏
status=no 不显示状态条
menubar=yes 显示选单栏
scrollbars=yes 显示滚动条
resizable=no 是否可以改变窗口大小
copyhistory=yes 显示历史按钮yes

  2)弹出窗口尺寸设置:

  width=300:设置新开窗口的宽度;

  height=200:设置新开窗口的高度;

  left=10:设置新开窗口距屏幕左边距;

  top=140:设置新开窗口距屏幕顶边距。

  你可以根据需要,任意调整新开窗口的初始位置。

  手工打开窗口

  可能读者会说,这么简单,不就是在一个网页中增加一个链接,在链接代码<a href="xxx.htm">中增加target="_blank"字段吗?其实,这种方法是最普通的新建浏览器窗口的方法。如果我们希望在某些时候能够定制这个新建窗口的外观,那该怎么办呢?

  我们可使用以下JavaScript代码完成该项工作:

  <script language="JavaScript">

  <!--

  function p(s)

  {

  open("intro/"+s,'','height=450,width=370,top=10,left=10,resizable=1,scrollbars=1,status=yes,toolbar=no,location=no,menu=no','fullscreen,scrollbars');

  };

  //-->

  </script>

  在要调用处,将这个链接加入即可。

  这种方法适用于网页中的下载栏目,特别是使用表格将一大批下载资料集中统一管理时,或在做下载程序的使用说明等。

  调用JavaScript程序

  下面再让我们来看看怎样调用JavaScript程序。调用JavaScript程序有两种方法,即植入法和链接法,分述如下:

  1.植入法

  用记事本打开准备弹出窗口的网页,如:index.htm,在<head>和</head>标签中间直接插入上述代码;

  2.链接法

  (1)将上述程序剪贴到记事本中,然后保存为.js文件(实际上它是一个后缀名为.js的文本文件,本例假设为xx.js),注意在文档的开头和结尾不要有<script language="JavaScript">和</script>标签;

  (2)在<head>和</head>标签中间添加如下代码:“<script language="JavaScript" src="xx.js"></script>”。

  注意事项

  在弹出窗口后,如果隐藏了标题栏,那么窗口的关闭按钮也看不到了,怎样关闭这个窗口呢?我们可将以下代码加入到新建窗口的网页中:

  <a href="javascript:window.close()" title="点击此处将关闭该窗口">关闭此窗口</a>

  只要点击,即可实现关闭该窗口的功能,当然,为了美观,你也可以用一幅图片来代替文字。

  (责任编辑Ray)



发表评论】【初学者园地】【科技聊天】【关闭窗口

新 闻 查 询

 相关链接
用Dreamweaver批量制作网页 (2001/08/31 16:09)
巧破网页禁用鼠标右键 (2001/08/31 11:02)
将网页置为浏览器的首页 (2001/08/30 14:20)
如何在网页制作中用好表格 (2001/08/30 14:18)
实用网页图形软件评比 (2001/08/24 13:55)
CutePage让网页文字随心而舞 (2001/08/23 16:18)
让网页文字随心而舞 (2001/08/22 16:21)
实现网页的动态过渡效果 (2001/08/22 16:25)
网页制作特效赏析二例 (2001/08/14 15:26)
轻松制作网页动态选单 (2001/08/13 13:26)
轻松制作网页动态选单 (2001/08/09 16:02)


科技时代意见反馈留言板 电话:010-82612286 或 010-82628888-3361   欢迎批评指正

网站简介 | 用户注册 | 广告服务 | 招聘信息 | 中文阅读 | Richwin | 联系方式 | 帮助信息

Copyright © 1996 - 2001 SINA.com, Stone Rich Sight. All Rights Reserved

版权所有 四通利方 新浪网