网站首页站长博客下载中心域名交易站长论坛域名主机免费电邮免费域名中文排行排名查询站长书库书籍教程下载
设为首页
加入收藏
总编信箱
投稿或申请专栏请先 [登 陆]
学院首页 网络编程 网页设计 图形图象 数 据 库 服 务 器 网络媒体 网络安全 个人专栏 站长CLUB 业界新闻 信息公告
 当前位置:首页 >> 网络编程 >> JSP专区 >> 正文
公告通知
返回上级列表
资料搜索
相关文章
小窗口大学问--玩转弹出窗口(3)
[ 来源:中国站长学院 | 作者:郁郁小蝎 | 时间:2005-4-30 9:19:03 | 浏览:人次 ]
收藏到新浪ViVi 收藏到365KEY 收藏到我摘  字号选择〖    〗/ 双击滚屏 单击停止  
  【5、主窗口打开文件1.htm,同时弹出小窗口page.html】

  如下代码加入主窗口〈head〉区:
  〈script language="javascript"〉
  〈!--
  function openwin() {
  window.open("page.html","","width=200,height=200")
  }
  //--〉
  〈/script〉

  加入〈body〉区:
  〈a href="1.htm" onclick="openwin()"〉open〈/a〉即可。

  【6、弹出的窗口之定时关闭控制】

  下面我们再对弹出的窗口进行一些控制,效果就更好了。如果我们再将一小段代码加入弹出的页面(注意是加入到page.html的HTML中,可不是主页面中,否则...),让它10秒后自动关闭是不是更酷了?

  首先,将如下代码加入page.html文件的〈head〉区:

  〈script language="JavaScript"〉
  function closeit() {
  setTimeout("self.close()",10000) //毫秒
  }
  〈/script〉
  
  然后,再用〈body onload="closeit()"〉 这一句话代替page.html中原有的〈BODY〉这一句就可以了。(这一句话千万不要忘记写啊!这一句的作用是调用关闭窗口的代码,10秒钟后就自行关闭该窗口。)

  【7、在弹出窗口中加上一个关闭按钮】
  〈FORM〉
  〈INPUT TYPE=´BUTTON´ VALUE=´关闭´ onClick=´window.close()´〉
  〈/FORM〉
  
  呵呵,现在更加完美了!
  
  【8、内包含的弹出窗口---一个页面两个窗口】
  
  上面的例子都包含两个窗口,一个是主窗口,另一个是弹出的小窗口。通过下面的例子,你可以在一个页面内完成上面的效果。

  〈html〉
  〈head〉
  〈SCRIT LANGUAGE="JavaScript"〉
  function openwin()
  {
  OpenWindow=window.open("", "newwin", "height=250,   
  width=250,toolbar=no,scrollbars="+scroll+",menubar=no");
  //写成一行
  OpenWindow.document.write("〈TITLE〉例子〈/TITLE〉")
  OpenWindow.document.write("〈BODY BGCOLOR=#ffffff〉")
  OpenWindow.document.write("〈h1〉Hello!〈/h1〉")
  OpenWindow.document.write("New window opened!")
  OpenWindow.document.write("〈/BODY〉")
  OpenWindow.document.write("〈/HTML〉")
  OpenWindow.document.close()
  }
  〈/SCRIPT〉
  〈/head〉
  〈body〉
  〈a href="#" onclick="openwin()"〉打开一个窗口〈/a〉
  〈input type="button" onclick="openwin()" value="打开窗口"〉
  〈/body〉
  〈/html〉

  看看OpenWindow.document.write()里面的代码不就是标准的HTML吗?只要按照格式写更多的行即可。千万注意多一个标签或少一个标签就会出现错误。记得用OpenWindow.document.close()结束啊。

[发送给好友]  [打印本页]  [关闭窗口]  [返回顶部]   转载请注明来源:http://edu.chinaz.com   
特别声明: 本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
栏目编辑: 设计风 责任编辑: 设计风
原始作者: 郁郁小蝎 录入时间: 2005-4-30 9:19:03
信息来源: 中国站长学院 投稿信箱: Edu#chinaz.com
设为首页 - 加入收藏 - 关于我们 - 广告服务 - 版权申明 - 友情链接 - 联系方式 - 总编信箱 - 会员投稿