Newer browsers allow you to detect the user's screen resolution using the screen.width and screen.height properties. This can be a helpful way to send viewers to the right version of your page, depending on their computer's screen resolution.
The properties hold the values of the pixel length of the width and height of the viewer's screen. For example, you could send the viewer an alert when a link is clicked that gives the screen resolution:
<A HREF="javascript:alert('Your resolution is '+screen.width+'x'+screen.height);">
Click for your screen resolution[/url]
This can be useful if you have a page designed for a screen resolution that is higher than some viewers may have available. For instance, if you had a design that would be viewed most comfortably at a resolution of 1024x768 or better you could set up an if-else statement to send the viewer to the high resolution page if their screen can handle it. If not, you can send them to a low resolution version of the page:
<SCRIPT language="JavaScript">
<!--
if ((screen.width>=1024) && (screen.height>=768))
{
window.location="highres.html";
}
else
{
window.location="lowres.html";
}
//-->
</SCRIPT>
As you can see, this could help you give your visitors a design that is best for their screen resolution and can allow you to create larger designs without having to leave some of your visitors with horizontal scrollbars.
