Скрипт с выбором css-файла
Все проверено (путь к файлам указан верно, условия выполняются), код вставлен в body index.php, но скрипт не работает. Скажите пожалуйста, что не так?
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template;?>/javascript/md_stylechanger.js"></script> </head> <body> <script language="javascript" type="text/javascript"> var height=0; var width=0; if (self.screen) { // for NN4 and IE4 width = screen.width height = screen.height } else if (self.java) { // for NN3 with enabled Java var jkit = java.awt.Toolkit.getDefaultToolkit(); var scrsize = jkit.getScreenSize(); width = scrsize.width; height = scrsize.height; } if (width == 1366 && height == 768) { document.write("<link rel='stylesheet' type='text/css' href='<?php echo $mosConfig_live_site; ?>/css/position.css'>"); }else if(width == 800 && height == 600){ document.write("<link rel='stylesheet' type='text/css' href='<?php echo $mosConfig_live_site; ?>/css/position.css'>"); } document.write("<link rel='stylesheet' type='text/css' href='<?php echo $mosConfig_live_site; ?>/css/position.css'>"); } </script> |
Цитата:
Цитата:
screen.width и screen.height — разрешение монитора. Эти значения проверять бесполезно, потому что: 1. Окно браузера не обязательно развернуто во весь экран. 2. Даже максимизированное окно браузера не обязательно занимает весь экран (можно меню пуск справа разместить или QIP прилепить к краю экрана, открыть какую нибудь панель в браузере и много других способов уменьшить рабочее пространство по горизонтали). Нужно проверять availWidth и availHeight. 2. Многие люди работают на нескольких мониторах, но не все браузеры в этом случае выдают правильные значения свойств объекта screen, например, IE будет показывать всегда разрешение основного монитора, которое может сильно отличаться от размеров монитора, на котором отображается окно браузера. Распространенная схема: дисплей ноутбука (основной монитор) + внешний монитор (на него расширен рабочий стол). К примеру внешний монитор имеет FullHD разрешение, а дисплей ноутбука 1366х768. Открываем IE во весь экран на FullHD-мониторе, получаем screen.width == 1366, вместо 1920. Что делать, если не подключать разные стили для разных разрешений? Верстать так, чтобы одни и те же стили одинаково хорошо отображался при любом разрешении монитора. Отформатируйте свой код: http://javascript.ru/formatting |
Ну, вообще-то интересовало, именно почему код не работает :)
Меня его минусы в общем-то устраивают. Несколько стилей для разных разрешений в любом случае лучше, чем всего одно. Разумеется, кроме описанного случая с двумя мониторами =) В общем, я предпочитаю все же использовать этот скрипт. Но он, блин, не работает. |
Цитата:
|
Хм. Видимо, я сильно ошибаюсь :) Просто я не знаю никаких проблем, если написать скрипт, который бы при опред. разрешении выдавал опред. таблицу стилей... Еще был вариант просто масштабировать весь сайт в зависимости от разрешения, так тот скрипт тоже не работает.
Ну, раз так, но можно конечно сделать с расчетом на 1024, и фиг с ним со скроллингом на меньших разрешениях и ладно что будет много свободного места по бокам на бОльших разрешениях. А я надеялась, кто-нибудь поможет :) Или хоть объясните, чем плохо то, что я хотела сделать (кроме случая с несколькими мониторами) |
http://www.yandex.ru/
http://www.rambler.ru/ http://mail.ru/ Где на этих сайтах скроллинг на меньших разрешениях и много свободного места на больших? |
на сколько я понимаю, у них "резиновые" сайты. Читала, что резиновые сайты это мол неудобно и непрактично, поэтому сама делать не стала. Кстати, яндекс - на больших разрешениях - поля, и меньше каких-то разрешений на мэйле и яндексе скроллинг есть... Хм, и на рамблере то же самое.
|
Ищу тоже самое что и вы, и похоже нашел.
Пример:
<a href="/" onclick="stylech();return false;">style change</a><br>
<script>
function stylech(){
tmp=document.createElement("div");
tmp.innerHTML = '<style type="text/css">a:hover{color:orange!important;font:bold 14px Tahoma,sans-serif!important;}</style>';
document.body.appendChild(tmp.firstChild);}
</script>
Можно подгружать и так
<a href="/" onclick="stylech();return false;">style change</a><br>
<script>
function stylech(){
tmp=document.createElement("div");
tmp.innerHTML = '<link rel="stylesheet" type="text/css" href="v2.css">';
document.body.appendChild(tmp.firstChild);}
</script>
Но не забывайте в v2.css указывать !important; |
| Часовой пояс GMT +3, время: 01:03. |