javascript基础：window对象的screen属性、移动窗口、缩放窗口

来源：互联网发布：ubuntu怎么看软件位置编辑：程序博客网时间：2024/05/16 01:33

window对象的screen属性，也是一个对象，包含了关于屏幕的分辨率，以及可视的长宽。

通过window对象的moveTo，resizeTo 函数，可以指定浏览器程序在屏幕上显示的x、y坐标，以及窗口的长宽，moveBy和resizeBy函数是相对于当前浏览器位置做移动和变化。

另外，代码对chrome浏览器和IE浏览器，进行分别处理。

最后通过window定时器实现了每隔0.5秒，自动变化窗口大小。

代码：

<!doctype html><html lang="en"> <head>  <meta charset="utf-8">  <title>Document</title>  <script language="javascript">        var interval;var i = 1;        //在chrome浏览器中，只有先open一个窗口，moveTo,resizeTo,moveBy,resizeBy函数才有效果function openWinChrome(){//参数1，参数2都为空，并且第3个参数指定具体的属性，才会有弹出窗口myWin= window.open("","","height=300,width=300");}//moveTo,resizeTo：绝对值//moveBy,resizeBy：相对值function maxWinChrome(){if(window.screen){myWin.moveTo(0,0);myWin.resizeTo(window.screen.availWidth,window.screen.availHeight);}}function moveWinChrome(){myWin.moveBy(50,50);    //移动窗口myWin.resizeBy(50,50);  //增大窗口}//IE能支持这些函数function maxWinIE(){if(window.screen){window.moveTo(0,0);window.resizeTo(window.screen.availWidth,window.screen.availHeight);}}function moveWinIE(){window.moveBy(150,150);   //移动窗口window.resizeBy(10,10);     //增大窗口}//每隔0.5秒，窗口会变大或者变小//以坐标位置650,300，长宽500为基础，计算出这个正方形的中心点坐标是900,550//如果变大之后的长宽是600，那么坐标点就是600,250function varyWinIE(){if(i == 1){i = 2;window.moveTo(650,300);window.resizeTo(500,500);}else if(i == 2){i = 1;window.moveTo(600,250);window.resizeTo(600,600);}}function ss(){interval = setInterval("varyWinIE()",500)}  </script> </head> <body><form><input type="button" value="打开窗口(chrome)" onclick="openWinChrome()"><input type="button" value="最大化窗口(chrome)" onclick="maxWinChrome()"><input type="button" value="移动窗口(chrome)" onclick="moveWinChrome()"><hr><input type="button" value="最大化窗口(IE)" onclick="maxWinIE()"><input type="button" value="移动窗口" onclick="moveWinIE()"><input type="button" value="变化窗口" onclick="ss()"><input type="button" value="停止变化窗口" onclick="clearInterval(interval);"></form><script language="javascript">document.write("<hr>屏幕分辨率：" + window.screen.width+ "*" + window.screen.height);document.write("<hr>屏幕视野：" + window.screen.availWidth+ "*" + window.screen.availHeight);document.write("<hr>色彩数：" + window.screen.colorDepth);document.write("<hr>浏览器程序左边页边距的坐标：" + window.screenLeft);document.write("<hr>浏览器程序上边页边距的坐标：" + window.screenTop);</script>   </body></html>

0 0