Screen Object Examples:

★ wanayoo — archive 1999 http://developer.netscape.com/docs/examples/javascript/screen/screen_object.html

Click Here!

SCREEN OBJECT EXAMPLES

The following are some simple cut and paste JavaScript code samples to illustrate the use of the client-side screen object which contains information about the display screen resolution and colors.

The JavaScript1.2 code utilizes the familiar object-based syntax:

screen.propertyName

For example, we can access the screen object properties for the following button which will open a window according to the user's full screen size:

The HTML code for the form button is simple enough:

A click event occurs when the button on the form is clicked. When a click event occurs, the onClick event handler executes, in this case, a single JavaScript function:

<SCRIPT LANGUAGE="JavaScript1.2"> function myFullscreen() { window.open('http://home.netscape.com','myName', 'width='+screen.width+',height='+screen.height+',top=0,left=0'); } </SCRIPT> The JavaScript code makes use of the screen.width and the screen.height object properties in order to specify the width and height of the screen in pixels for the specified windowFeature values for the open (window object).

There are more screen object properties, such as screen.availTop and screen.availLeft to specify the available client-side screen top and left values, in pixels, minus permanent or semi-permanent user interface features displayed by the operating system, such as the Taskbar on Windows.

Therefore, you can open a window precisely where you want according the user's display screen resolution. For example, let's say we wanted to open a long narrow navigation window (100 pixels wide) and display it right in the very top, left corner of the user's screen. We could just set the windowFeature top and left values to zero (0), and the height to 400 pixels or whatever; but then the window could get hidden behind something like the user's Taskbar if they have it sticking out in any of those areas.

Using the screen object properties availTop, availLeft, availHeight, the following example opens a narrow window according the user's screen display:

So, if you have your Taskbar properties set so that it's currently displayed from the bottom, left, or top, then that window should have been opened and positioned accordingly. See the following code: <SCRIPT LANGUAGE="JavaScript1.2"> function myAvailable() { window.open('about:blank','myName', 'width=100,height='+screen.availHeight+',top='+screen.availTop+',left='+screen.availLeft); } </SCRIPT> <FORM> <INPUT TYPE=button VALUE="Open to available" onClick="myAvailable();"> </FORM>

As you can see from these copy and pastes screen object examples, you can write code to size and position windows according your users' display screen resolution.

For the latest technical information on Sun-Netscape Alliance products, go to: http://developer.iplanet.com

For more Internet development resources, try Netscape TechSearch.