Как узнать разрешение экрана и подставить css?

Компьютерный форум OSzone.net (http://forum.oszone.net/index.php)

- Вебмастеру (http://forum.oszone.net/forumdisplay.php?f=22)

Как узнать разрешение экрана и подставить css?

Как узнать разрешение экрана и подставить css?
Залача:
если разрешение 1024х768 то грузим стиль1;
если разрешение 1280х1024 грузим стиль2;
если разрешение больше 1280х1024 грузим стиль2;
во всех отсальных случаях грузим стиль1;

В яве вообще не чего не понимаю.. ТАк что если не сложно с примером.
Спасибо большое.

метод не идеальный.
а если у меня окно браузера не в развернутом виде? Тогда будет абракадабра?

Не тогда просто появится скрол

Код:

    

if (screen.width == 1024 && screen.height == 768)

           document.getElementById("id").style.style1="valueOfstyle1";        

       else if (screen.width => 1280 && screen.height=>1024)

           document.getElementById("id").style.style2="valueOfstyle2";

       else 

           document.getElementById("id").style.style1="valueOfstyle1";

Источник

Сам проверю, и может под вас настрою, когда будет доступ к ноутбуку. где то через 2 часа

хе-хе-хе... а на гугле, то и есть Ваш вопрос ))

Цитата:

Я так понял что моя идея с нгесколькими дизайнами плохая. А что ж делать? когда дизайн сайта на большом разрешении смотрится плохо если он не на весь экран? Какие есть варианты?

Делать сайт с резиновым дизайном. Указывать размеры в процентах.

Возможен и такой способ.

Код:

<script language=javascript>

width=document.outerWidth;

height=document.outerHeight;

 document.getElementById("id").style.width=width;

 document.getElementById("id").style.height=height;

</script>

Мне был нужен такой скрипт, и я его написал для своего сайта. Я сделал сайт под 9 разрешений монитора (да, знаю, я такой), и сделал это так:

Код:

var width = screen.width;

var height = screen.height;

if (width < 1152 && height < 864){

roz=1

}

else if(width >= 1152 && width <= 1280 && height < 800 || height == 864){

roz=2

}

else if(width == 1280 && height >= 800 && height < 960){

roz=3

}

else if(width == 1280 && height >= 960 && height < 1024){

roz=2

}

else if(width >= 1280 && width < 1440 && height <= 1024){

roz=5

}

else if(width >= 1440 && width <= 1600 && height >= 900 && height < 1200){

roz=6

}

else if(width >= 1600 && width < 1680 && height >= 1200){

roz=7

}

else if(width >= 1680 && width < 1920 && height >= 1050){

roz=8

}

else if(width >= 1920 && height >= 1200){

roz=9

}

else{

roz=1

}

тут переменной roz давал различные значения от 1 до 9,
а по по поводу разрешений сделал вообше универсально, если разрешение меньше по длине*висоте чем1152*864, то roz=1 (то то что подстроенно под 1024*768), потом если разрешение по длине*висоте находится между 1152*864 и 1280*800 (это все по списку разрешений монитров) , то roz=2 (то то что подстроенно под 1152*864), и т.д.
(от самых маленьких до самых огромных... разрешения я выбрал самые популярные они здесь анализ делаете сами) надеюсь поняли... теперь дальше. Вот пример

Код:

switch(roz){

case 1:

x1 = ' <img src="footer1.jpg" borde="0"> '

break

case 2:

x1 = ' <img src="footer2.jpg" borde="0"> '

case 3:

x1 = ' <img src="footer3.jpg" borde="0"> '

break

case 4:

x1 = ' <img src="footer4.jpg" borde="0"> '

break

case 5:

x1 = ' <img src="footer5.jpg" borde="0"> '

break

case 6:

x1 = ' <img src="footer6.jpg" borde="0"> '

break

case 7:

x1 = ' <img src="footer7.jpg" borde="0"> '

break

case 8:

x1 = ' <img src="footer8.jpg" borde="0"> '

break

case 9:

x1 = ' <img src="footer9.jpg" borde="0"> '

break

}

тут если roz=1 то x1 = ' <img src="footer1.jpg" borde="0"> ' , а если roz=2 то x1 = ' <img src="footer2.jpg" borde="0"> ' , и т.д.
осталось вставить их в страницу.

HTML код:

<body>

...

<script type="text/javascript">

document.write(x1);

</script>

...

</body>

Вот и всё. Если нужно ксс то вместо <img src="footer1.jpg" borde="0"> пишите <link rel="stylesheet" type="text/css" href="home/css/style1.css"> , и ставите в хед

HTML код:

<html>

<head>

...

<script type="text/javascript">

document.write(x1);

</script>

...

</head>

название переменных может быть любое. Всем всё разжевал, а где ваши спасибочки? :)

Хы. «Внимание: последний ответ в эту тему был добавлен более чем 1 Год назад».

Инфо к размышлению - а что если сразу при входе на сайт (проверить можно по рефу, по куке, по сессии) единоразово определять резолюшн и затем генерить страницу с указанием подходящего css?

Тогда можно не пихать яву в каждой странице, а плюнуть в браузер скриптом с редиректом и полученные данные скинуть в куку или в сессию?

Какие еще варианты решения есть?