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(任务栏)以外的长宽

    欢迎增加JAVA技术交流群:74955800



  • 相关阅读:
    vue开发chrome扩展,数据通过storage对象获取
    Vue手动集成less预编译器
    Google Translate寻找之旅
    Javascript Range对象的学习
    Javascript Promises学习
    SublimeText 建立构建Node js系统
    We're sorry but demo3 doesn't work properly without JavaScript enabled. Please enable it to continue.
    npm安装包出现UNMET DEPENDENCY报错
    (转载)命令行说明中格式 尖括号 中括号的含义
    Linux重启网卡服务Failed to start LSB: Bring up/down networking.
  • 原文地址:https://www.cnblogs.com/mfrbuaa/p/3936901.html
Copyright © 2011-2022 走看看