JavaScript基础 window.open(url,name,options) 弹出一个 新窗口 屏幕居中显示 获取屏幕的有效宽度
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript基础 window.open(url,name,options) 弹出一个 新窗口 屏幕居中显示 获取屏幕的有效宽度相关的知识，希望对你有一定的参考价值。
镇场诗：
清心感悟智慧语，不着世间名与利。学水处下纳百川，舍尽贡高我慢意。
学有小成返哺根，愿铸一良心博客。诚心于此写经验，愿见文者得启发。
——————————————————————————————————————————
code:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 5 <title></title> 6 <script type="text/javascript"> 7 /* 8 window.open(url,name,options); 9 10 url:准备显示的文件 11 name:新窗口的名字 ，给<a>标记的target属性来用 12 13 left:新窗口距离屏幕左边的距离 14 top:新窗口距离屏幕上边的距离 15 menubar:是否显示菜单栏 16 toolbar:是否显示工具栏 17 status:是否显示状态栏 18 19 返回一个window对象的变量 20 */ 21 22 //弹出一个 新窗口 屏幕居中显示 23 function Init() 24 { 25 var urlNewPage = "http://wwww.baidu.com";//打开的新网页的地址是 空 26 var nameNewPage = "newWindow";//打开的新网页的名字是 newWindow 27 var heightNewPage = 400;//打开的新网页的高度 28 var widthNewPage = 400; //打开的新网页的宽度 29 30 var widthScreen = screen.availWidth;//屏幕的有效宽度 不含任务栏 31 var heightScreen = screen.availHeight;//屏幕的有效高度 不含任务栏的高度 32 33 var x = (widthScreen - widthNewPage) / 2; 34 var y = (heightScreen - heightNewPage) / 2-30;//地址栏是去不掉的，所以要内容尽量居中的话，需要-xxx 35 // 要先写left后写top，才可以。我第一次就颠倒顺序了，报错了。 36 var optionsForNewPage = "width=" + widthNewPage + ",height=" + heightNewPage+",left="+x+",top="+y; 37 //打开 38 var winObj = window.open(urlNewPage, nameNewPage, optionsForNewPage); 39 } 40 41 42 43 </script> 44 </head> 45 <body onload="Init()"> 46 当网页加载完成时，执行Init() 47 </body> 48 </html>
result:
(⊙o⊙)…，这个效果不展示出来了。。。
桌面太乱。。。惭愧，惭愧。
——————————————————————————————————————————
博文的精髓，在技术部分，更在镇场一诗。IDE: VS2015;浏览器: Firefox。
html+css+js，强，值得努力学习。传智播客的视频教程是我的学习资源,推荐。
如果博文有可以改进的地方，请留下评论，我会认真思考的。
注：因为博主境界不够，所以此文仅供测试与参考使用，不可用于其他用途。当参考博文内容时，代表您已接受使用条款。
以上是关于JavaScript基础 window.open(url,name,options) 弹出一个 新窗口 屏幕居中显示 获取屏幕的有效宽度的主要内容，如果未能解决你的问题，请参考以下文章
JavaScript基础 window.open(url,name,options) 弹出一个 新窗口 屏幕居中显示 获取屏幕的有效宽度
JavaScript基础 window.open(url,name,options) 新建一个新的网页 设置新网页的网址 名字 宽度 高度