js的screen对象

来源:互联网 发布:激光聚焦矩阵 mc百科 编辑:程序博客网 时间:2024/06/08 05:05

screen对象

screen对象用于获取用户的屏幕信息。

语法:

window.screen.属性

对象属性:

屏幕分辨率的高和宽

window.screen 对象包含有关用户屏幕的信息。

1. screen.height 返回屏幕分辨率的高

2. screen.width 返回屏幕分辨率的宽

注意:

1.单位以像素计。

2. window.screen 对象在编写时可以不使用 window 这个前缀。

我们来获取屏幕的高和宽,代码如下:

<script type="text/javascript">  document.write( "屏幕宽度:"+screen.width+"px<br />" );  document.write( "屏幕高度:"+screen.height+"px<br />" );</script>

屏幕可用高和宽度

1. screen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,比如任务栏。

2. screen.availHeight 属性返回访问者屏幕的高度,以像素计,减去界面特性,比如任务栏。

注意:

不同系统的任务栏默认高度不一样,及任务栏的位置可在屏幕上下左右任何位置,所以有可能可用宽度和高度不一样。

我们来获取屏幕的可用高和宽度,代码如下:

<script type="text/javascript">document.write("可用宽度:" + screen.availWidth);document.write("可用高度:" + screen.availHeight);</script>

注意:根据屏幕的不同显示值不同。

编程练习

制作一个跳转提示页面:

要求:

1. 如果打开该页面后,如果不做任何操作则5秒后自动跳转到一个新的地址,如慕课网主页。

2. 如果点击“返回”按钮则返回前一个页面。

效果:



注意: 在窗口中运行该程序时,该窗口一定要有历史浏览记录,否则"返回"无效果。


<!DOCTYPE html><html> <head>  <title>浏览器对象</title>    <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>    </head> <body>  <!--先编写好网页布局-->  <h2>操作成功</h2>  <p><span id="sec">5</span>秒后回到主页<a href="#" onclick="goBack()">返回</a></p>     <script type="text/javascript">         var second = 5;   function timeCount(){            document.getElementById("sec").innerHTML = second;             second = second - 1;            setTimeout(timeCount,1000);           if(second == 0){         window.location.href="http://www.baidu.com";            }       }      function goBack(){       window.history.back();   }      setTimeout(timeCount,1000);      //通过window的location和history对象来控制网页的跳转。    </script> </body></html>



0 0
原创粉丝点击