Click to See Complete Forum and Search --> : JS for screen resolutions and IE/FF


mwilligers
12-04-2006, 06:12 AM
Hello,
I am struckeling for one week now with finding and trying all kind of JS for different screensolutions. But none of these doesn't choose the right StyleSheet. I tried the two which can be found on this site,but they are nog working.
And does anyone has a JS which also looks for de browser.
So one JS for the above items?

Thank you very very much in advance!!!

many regards,
Mariėtte from Holland

spangltk
12-04-2006, 08:42 AM
not sure what your asking, but this might help.
1. Move the window to the top left corner : window.moveTo(0,0);
2. Max out the window: window.resizeTo(1280 , 1280 );
3. Retrive the values-
FF:
window.innerWidth & window.innerHeight
IE:
document.body.offsetWidth & document.body.offsetHeight

that should give you an idea of their screen resolution.

The script found here will give you browser, version, and users OS:
http://www.quirksmode.org/js/detect.html

mwilligers
12-04-2006, 09:39 AM
Here some more info:

I made two style.sheets: one for 1280 x 1024 and one for 1024 x 768.

Further more, I made a photoshop-layout with self-made buttons. The psd file is converted to html and jpg's by Image Ready . The site must be centered in the middle, with a background bigger than the biggest screen. To get the screen covered.
I used a lot of DIV's with absolute positions for all kind of flash-animations, forms, tables and text.

When I made the first style.sheet it looked quite good on my computer (1280X1024). But on another computer at home (1024x768) it was awfull. All the text and the other items were shifted from the places were it should be.
With Google I found some Javascripts to get this problem fixed. But none of these work. I want that I have a Javascript (or something else) that can make a decision, based on the applied screen so that the right style.sheet is applied. I made the followings (but it doesn't work!)

<link rel="stylesheet" type="text/css" media="screen" href="../include/fitbodies2-1280.css">
<script type="text/javascript">
<!--
/* This script and many more are available free online at
The JavaScript Source!! http://javascript.internet.com */

if (screen.width < 1100)
link = document.getElementsByTagName("link")[0];
link.href href="../../include/fitbodies2-1024t.css";
-->
</script>
<script type="text/javascript" src="../include/fitbodies2.js"></script>

I will be very happy if someone helps me!!!
regards,
Mariėtte

spangltk
12-04-2006, 09:47 AM
I'm not familiar with what your doing, but to narrow down the problem try placing an alert in the 'if' statement to see if the condition is being met.

i.e.
if (screen.width<1100)
alert('screen is: '+screen.width+'px');

mwilligers
12-04-2006, 09:51 AM
I made a new stylesheet with a black backgrond. But it doesn't select the right stylesheet.

spangltk
12-04-2006, 10:00 AM
then I'm guessing the "If" condition works but the script to switch style sheets doesn't. This is something I've never tried, I would research another method to link to the style sheet ( if it becomes impossible I would just forward it to a different page depending on the settings you want, but that would be a last resort ).

mwilligers
12-04-2006, 10:03 AM
That what I think as well. But there should be a solution? I am not the first with this problem?