detecting and displaying the screen size

[letom]

can any body help in java script coding for
detecting and displaying the screen size(resolution), color depth, browser details, and all about their system and browser combination.

[jscheuer1]

That's really at least three different things. Two (the browser and OS) are fairly well covered here:

http://www.quirksmode.org/js/detect.html

Which is well documented as to how it can be maintained, and that can be expanded upon for more detailed information. I've used it (with improvements and in addition to other code) in professional work to help generate reports on page usage.

Virtually all the information about the browser and OS that you can get is contained in the navigator.userAgent string. But the way in which it's presented varies by browser and OS. See:

http://www.useragentstring.com/

for more details. You can use their API to get a wealth of information to your page.

There's more information available in the navigator object, but it varies by browser and OS, see:

http://home.comcast.net/~jscheuer1/side/nav_obj/

Open it in a few different browsers, you should get the idea. One thing that's fairly consistent is the navigator.cookieEnabled boolean.

I'm not sure if you can get the color depth. That may require a higher level language run partially on the server. Flash might be able to detect that. Screen res/dimensions is easy. All browsers will report these accurately:

screen.width

and:

screen.height

[bernie1227]

Interestingly enough, color depth is actually fairly easy. Here's some coded to detect and output color depth.


<script type="text/javascript">
<!--
var depth = window.screen.colorDepth;
var colors = Math.pow (2, depth);
document.write (depth + " bits which means " + colors + " colors.");
//-->
</script>

This also has colors which is relevant.
Bernie

[letom]

Thanks :) @jscheuer1 & Bernie

[jscheuer1]

Interestingly enough, color depth is actually fairly easy. Here's some coded to detect and output color depth.


<script type="text/javascript">
<!--
var depth = window.screen.colorDepth;
var colors = Math.pow (2, depth);
document.write (depth + " bits which means " + colors + " colors.");
//-->
</script>

This also has colors which is relevant.
Bernie

As a side note, the highlighted in the above are obsolete and can cause problems if used improperly.

They used to be wise in order to hide the code from earlier browsers that could neither interpret javascript nor ignore it when encountered.

No one uses such browsers today If they did, they wouldn't be able to view 99% of the web anyway. So there's no longer any need to cater to them.

It can be useful to use not character data comment tags:


<script type="text/javascript">
/* <![CDATA[ */
var depth = window.screen.colorDepth;
var colors = Math.pow (2, depth);
document.write (depth + " bits which means " + colors + " colors.");
/* ]]> */
</script>

But these are only useful for validation to XHTML DOCTYPEs. They don't serve any functional purpose.

Ideally though, no such comments of any type should be used. If there's any problem with validation, the script should be made external.

[bernie1227]

As a side note, the highlighted in the above are obsolete and can cause problems if used improperly.

They used to be wise in order to hide the code from earlier browsers that could neither interpret javascript nor ignore it when encountered.

No one uses such browsers today If they did, they wouldn't be able to view 99% of the web anyway. So there's no longer any need to cater to them.

It can be useful to use not character data comment tags:


<script type="text/javascript">
/* <![CDATA[ */
var depth = window.screen.colorDepth;
var colors = Math.pow (2, depth);
document.write (depth + " bits which means " + colors + " colors.");
/* ]]> */
</script>

But these are only useful for validation to XHTML DOCTYPEs. They don't serve any functional purpose.

Ideally though, no such comments of any type should be used. If there's any problem with validation, the script should be made external.

Quite true forgot about those, I actually found he example in a copy of the gold edition f the JavaScript bible, written before we had the pain that is ie6, so it still was using the comments on the JavaScript as well as noscript tags.