Get Adobe Flash player

ADs:

CSS and screen resolution - решение

На одном из проектов встал вопрос о подборе css под разрешение экрана посетителя. Перелопатив порядочное количество страниц, посвященных данной теме, сделал выбор в пользу js, т.к. способ с использованием css3 пока не поддерживается подавляющим большинством браузеров. Читаем...

Вот собственно js


var height=0;
var width=0;
if (self.screen)
{
width = screen.width
height = screen.height
}
else
if (self.java)
{
var jkit = java.awt.Toolkit.getDefaultToolkit();
var scrsize = jkit.getScreenSize();
width = scrsize.width;
height = scrsize.height;
}
if (width > 0 && height > 0)
{
if (width >= 1280) { document.writeln('<LINK href="/css/lsize.css" type=text/css rel=stylesheet>'); }
else
{
if (width >= 1024) { document.writeln('<LINK href="/css/msize.css" type=text/css rel=stylesheet>'); }
else { document.writeln('<LINK href="/css/ssize.css" type=text/css rel=stylesheet>'); }
}
}
else document.writeln('<LINK href="/css/msize.css" type=text/css rel=stylesheet>');


и способ врезки в страницу

«link rel="stylesheet" type="text/css" href="/css/msize.css" /»
«script src="/js/screen.js" type="text/javascript"»«/script»

Думаю, здесь будет уместно небольшое пояснение. Первая строка, подключающая msize.css, необходима на случай отключенного в браузере js (метод noscript в body плох тем, что не проходит валидацию по w3c-стандарту). Если же js отработал, то подключенный им css перекроет дефолтные значения из msize.

Надеюсь, кому-нибудь пригодится.

P.S. Двойные угловые скобки не ошибка, в html естественно используются <>.

You have no rights to post comments


Украинская Баннерная Сеть
Brochure Design Designer

Найти

Тэги

Мы знакомы?

Brochure Design Designer