zoukankan      html  css  js  c++  java
  • window.open()具体解释及浏览器兼容性问题

    一、基本的语法:
    window.open(pageURL,name,parameters)
    当中:
    pageURL 为子窗体路径
    name  为子窗体名字
    parameters 为窗体參数(各參数用逗号分隔)

    二、演示样例

    <script type="text/javascript">
    	window.open('page.html','newwindow','height=500,width=800,top=0,left=0,
    		     toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no') 
    </script>
    page.html将在新窗体newwindow中打开,宽为800,高为500,距屏顶0象素,屏左0象素,

    无工具条,无菜单条,无滚动栏,不可调整大小,无地址栏,无状态栏。

    各浏览器对window.open()的窗体特征sFeatures參数支持程度存在差异

    各浏览器执行结果汇总:

    上表中为各个浏览器对 features 各參数选项的支持程度。当中须要特殊说明的例如以下:

    【标注1】:IE7 IE8 Firefox Chrome Safari 中,当"menubar"选项为"yes"时,默认不显示菜单条,须要按ALT键后菜单条才可显示。相反当 "menubar"选项为"no"时,即使按了ALT键也不会显示菜单条。


    【标注2】:Safari中,开启"location"选项与开启"toolbar"选项时显示效果一致。
    【标注3】:IE6 IE8 Chrome 中,使用"top"和"left"定位,假设出现设定的的坐标值过大,弹出窗体将可能显示在屏幕可视范围外。
    【标注4】:IE7 Firefox Safari Opera中,使用"top"和"left"定位,假设出现设定的的坐标值过大,窗体会自己主动调整"top"与"left"值,确保窗体正常显示在屏幕可视区域内。
    【标注5】:Chrome Opera中,不支持在没有设定"width"与"height"值的情况下独立使用"left"和"top",此时"left""top"设定值均不生效。


    【标注6】:Chrome 中,不支持在没有设定"left"和"height"值的情况下独立使用"width"与"height",此时"width" "height"设定值均不生效。结合【标注5】说明可知,在Chrome中弹出窗体不论想要设定宽高或位置中的一个或几个值,都必须将他们所有赋值,否则都将不起作用。
    【标注7】:Firefox Chrome 中,地址栏会始终显示。
    【标注8】:Opera 中,地址栏默认不显示,但能够点击页面最上方横条使他显示出来,设置"location=yes"后地址栏会自己主动显示出来。
    【标注9】:Chrome Opera 中,不论"menubar"值怎样设置,永远不显示菜单条。
    【标注10】:Firefox Safari Chrome Opera中不管"resizable"值怎样设置,窗体永远可由用户调整大小。
    【标注11】:Safari Chrome 中,在页面存在滚动栏的情况下,不管"scrollbars"值怎样设置,滚动栏始终可见。


    【标注12】:IE7 在 Windows XP SP3 系统中默认能够支持"status "參数隐藏状态栏;而在 Windows Vista系统默认环境下不支持"status"參数。状态栏始终可见.这与两个系统中默认的 IE7 小版本不同有关,前者版本较低,后者版本较高。


    【标注13】:Firefox 中,不管"status"值怎样设置,状态栏始终可见,而 Chrome Opera中,则与前者相反,状态栏始终不可见。
    【标注14】: Chrome Opera 中,不管"toolbar"值怎样设置,始终不显示工具栏。
    综上所述,可见window.open方法的sFeatures參数支持程度存在巨大差异,使用时须慎重为之。

                                                                                                                 摘自:http://www.w3help.org/zh-cn/causes/BX1053#


    一般我们用window.open打开页面都须要居中显示,演示样例代码

    var width=800;  //弹出窗体的宽度;
    var height=500; //弹出窗体的高度;
    var top = (window.screen.availHeight-height)/2; //窗体的垂直位置;
    var left = (window.screen.availWidth-width)/2;  //窗体的水平位置;
    window.open('page.html','newwindow','height='+height+',width='+width+',top='+top+',left='+left+',
    		     toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')

    availHeight和height的差别

    window.screen.width 返回当前屏幕宽度(分辨率值)
    window.screen.height 返回当前屏幕高度(分辨率值) 
    screen.availWidth,screen.availHeight是指除去taskbar(任务栏)以外的长宽


  • 相关阅读:
    eclipse中用maven打包报错排查
    关于如何下载spring tool Suite指定版本的安装包
    win10配置JDK和tomecat
    C#读取MySql时,如果存在字段类型为date/datetime时的可能会出现以下问题
    批处理安装,卸载,启动,停止服务
    微信小程序图表组件 wx-f2
    获取项目路径
    Global.asax.cs之在线人数统计
    Global.asax 文件之 Application_Error
    Global.asax 文件是什么
  • 原文地址:https://www.cnblogs.com/jhcelue/p/6869534.html
Copyright © 2011-2022 走看看