|
JavaScript и CSS
Подскажите, как можно при помощи JavaScript обратиться к классам CSS и переопределить их параметры? Суть такая: страница при загрузке определяет разрешение монитора и подстраивает размеры элементов под конкретное разрешение.
|
demoniqus,
В интернете по этой теме довольно много информации. Вот, например, с шаманского форума: http://xpoint.ru/know-how/JavaScript/TablitsyiStiley?2 А еще можно подгружать разные, уже "готовые" CSS файлы, в зависимости от определённого разрешения экрана, просто добавляя соответствующий link элемент в DOM. |
мысль про подключение интересная, но получилось так, что на php все реализовано таким образом, что страница подстраивается под любое разрешение - хоть 1280*1024, хоть 1281*1023. Единственная проблема в том, что в php-файл надо передавать разрешение. А при первом запуске сайта (например при переходе с другого сайта) этого не произойдет. Из-за этого сайт может отобразиться не слишком коректно. Поэтому хотелось переделать его на javascript. А создать CSS на каждое разрешение - нереально. Надо исправлять параметры динамически.
|
demoniqus, а если пользователь в процессе просмотра сайта решит изменить размеры окна?
Вот к примеру из поиска приходят почти всегда с открытием нового окна, при этом IE, как правило, не распахивает его, т.е. у вас загрузится версия для маленького окна, пользователь распахнет его и что он увидит? |
demoniqus, камрад Kolyaj прав.
Такие вещи решаются с помощью CSS и только CSS. |
Привязка идет не к размерам окна, а к разрешению монитора. Просто тестируя сайт, я обратил внимание, что то, что нормально выглядет при разрешении 1024, нереально разглядеть на разрешении 1280 и наоборот: то, что нормально для 1280, на разрешении 1024 может не по-детски напугать размерами. Впринципе наиболее частые разрешения 1024 и 1280. 800 уже совершенно неактуально, а прочие разрешения встречаются довольно редко. Поэтому можно было бы использовать две таблицы стилей, но все-таки хочется сохранить возможность сайта подстраиваться под конкретные параметры монитора. Прописывать во все необходимые элементы id-ишники, а потом для каждого из них писать javascript-код черезчур накладно. Через имя тега (a, div, font и т.п.) обратиться не получится. А PHP довольно существенно притормаживает. И второй недостаток PHP - в первый раз разрешение как параметр не передается - поэтому пришлось задать 1024. Поэтому ищу возможность через javascript обратиться именно к классу CSS и переопределить его параметры.
|
demoniqus, а может лучше все-таки сверстать нормально?
Ну вот, например, как вариант http://habrahabr.ru/blog/css/37042.html |
Кое-что интересное для себя в статье нашел - спасибо!)))
Про em-ную верстку знаю. Собственно у меня весь текст, ссылки и прочее в em-ах и стоит. Однако далеко не все знают, что можно покрутить колесико мышки+Ctrl или зайти в Вид-Размер шрифта, если сайт не слишком корректно отображается - и все достоинства такого метода идут на смарку. Если на странице написано, что текст имеет размер 5em, то при любом разрешении монитора он и будет 5em. Только при 1600*1280 он будет уместен, а при 1024*768 буквы будут больше монитора... Приведу часть кода: < ?php if (!isset($factor)) {$factor=1024;} $factor=round($factor/1600*80); ?> //в переменную $factor изначально передается разрешение монитора. //Если происходит вызов страницы без параметров, то присваивается //значение 1024. Далее переменная $factor превращается в коэффициент //для вычисления размеров объектов на странице. Значения 1600 и 80 //дали приятный результат и просто не стал их трогать более. ......... < STYLE type="text/css"> a.Amenu{...;font-size: < ?php $factor1= $factor*2/100; echo $factor1; ?>em;....} a.contacts{.......} ............. <body..... .... <div style="font-size: < ?php $factor1= $factor*3/100; echo $factor1; ?>em;...."> ..... Конструкция font-size: < ?php $factor1= $factor*2/100; echo $factor1; ?> встречается во многих местах и вероятно значительно притормаживает выполнение страницы. Кроме того, как я и сказал, страница может быть запущена без параметров. Поэтому я пытаюсь ее заменить на JavaScript, который будет быстрее работать, не нагружать лишний раз сервер и никаких проблем с передачей параметров. Может у кого-нибудь есть идеи по этому поводу? |
demoniqus, слушайте, вы никогда не слышали термин "резиновая верстка"? И никогда не были на сайтах, которые выглядят нормально, даже если поменять размер окна браузера?
Вам нужно всего лишь нормально сверстать на CSS, а не приделывать пятое колесо на PHP или JS. вот тут можно основную раскладку определить, в одну, две или три колонки. |
Мечталось бы сотворить такое дело: на страничке выбирается стиль таблички и табличка рисуется в выбранном стиле. Можно изменить с помощью явы свойство напрмер цвета в правилах цсс. Но как вытащить титл, название, имя cssRule? :(
|
Часовой пояс GMT +3, время: 19:24. |
|