JavaScript Tutorial/Screen/Screen Object

Материал из Web эксперт
Перейти к: навигация, поиск

screen

The screen object provides an access to various properties of the user"s screen.

These properties are often accessed and used sizing windows that various scripts open.

Properties of the screen Object

Item Description AvailHeight Returns the pixel height of the user"s screen, minus the toolbar or any other "permanent" objects. availWidth Returns the pixel width of the user"s screen, minus the toolbar or any other "permanent" objects. colorDepth Returns the maximum number of colors the user"s screen can display. This is in bit format. height Returns the pixel height of the user"s screen. pixelDepth Returns the number of bits per pixel of the user"s screen. Internet Explorer did not support this property at the time of this writing and returns undefined. width Returns the pixel width of the user"s screen.



<html>
    <head>
    <script language="JavaScript1.2">
    <!--
    function openWin(){
      var myWin = open("", "","width=450,height=200");
      myWin.document.write("The availHeight is: " + screen.availHeight + "<br>");
      myWin.document.write("The availWidth is: " + screen.availWidth + "<br>");
      myWin.document.write("The colorDepth is: " + screen.colorDepth + "<br>");
      myWin.document.write("The height is: " + screen.height + "<br>");
      myWin.document.write("The pixelDepth is: " + screen.pixelDepth + "<br>");
      myWin.document.write("The width is: " + screen.width + "<br>");
      myWin.document.close();
    }
    -->
    </script>
    </head>
    <body>
    <form name="myForm">
      <input type=BUTTON value="Click to See Screen Properties" name="myButton" onClick="openWin()">
    </form>
    </body>
    </html>


screen.availHeight

The availHeight property gets the available pixel height of the user"s screen.

This height is minus any toolbar or any other "permanent" objects that may be on the user"s screen.



<html>
    <script language="JavaScript1.2">
    <!--
    document.write("The available height of this user"s screen is <b>");
    document.write(screen.availHeight + "</b> pixels");
    -->
    </script>
</html>


screen.availLeft

<html>
<head>
<title>History</title>
</head>
<body>
<script type="text/javascript">
    document.writeln("screen.availTop: " + screen.availTop + "<br />");
    document.writeln("screen.availLeft: " + screen.availLeft + "<br />");
    document.writeln("screen.availWidth: " + screen.availWidth + "<br />");
    document.writeln("screen.availHeight: " + screen.availHeight + "<br />");
    document.writeln("screen.colorDepth: " + screen.colorDepth + "<br />");
    document.writeln("screen.pixelDepth: " + screen.pixelDepth + "<br />"); 
</script>
</body>
</html>


screen.availTop

<html>
<head>
<title>History</title>
</head>
<body>
<script type="text/javascript">
    document.writeln("screen.availTop: " + screen.availTop + "<br />");
    document.writeln("screen.availLeft: " + screen.availLeft + "<br />");
    document.writeln("screen.availWidth: " + screen.availWidth + "<br />");
    document.writeln("screen.availHeight: " + screen.availHeight + "<br />");
    document.writeln("screen.colorDepth: " + screen.colorDepth + "<br />");
    document.writeln("screen.pixelDepth: " + screen.pixelDepth + "<br />"); 
</script>
</body>
</html>


screen.availWidth

The availWidth property gets the available pixel width of the user"s screen.

This width is minus any toolbar or any other "permanent" objects that may be on the user"s screen.



<html>
    <script language="JavaScript1.2">
    <!--
    document.write("The available width of this user"s screen is <b>");
    document.write(screen.availWidth + "</b> pixels");
    -->
    </script>
</html>


screen.colorDepth

<html>
<head>
<title>History</title>
</head>
<body>
<script type="text/javascript">
    document.writeln("screen.availTop: " + screen.availTop + "<br />");
    document.writeln("screen.availLeft: " + screen.availLeft + "<br />");
    document.writeln("screen.availWidth: " + screen.availWidth + "<br />");
    document.writeln("screen.availHeight: " + screen.availHeight + "<br />");
    document.writeln("screen.colorDepth: " + screen.colorDepth + "<br />");
    document.writeln("screen.pixelDepth: " + screen.pixelDepth + "<br />"); 
</script>
</body>
</html>


screen.height

The height property of the screen object accesses the height of the user"s screen in pixels.



<html>
    <script language="JavaScript1.2">
    <!--
    document.write("The height of this user"s screen is <b>");
    document.write(screen.height + "</b> pixels");
    -->
    </script>
</html>


Screen.pixelDepth

The pixelDepth property gets the number of bits per pixel of the user"s screen.



<html>
    <script language="JavaScript1.2">
    <!--
    document.write("The pixel depth of this user"s screen is <b>");
    document.write(screen.pixelDepth + "</b> bit");
    -->
    </script>
</html>


screen.width

The width property gets the width of the user"s screen in pixels.



<html>
    <script language="JavaScript1.2">
    <!--
    document.write("The width of this user"s screen is <b>");
    document.write(screen.width  + "</b> pixels");
    -->
    </script>
</html>