Изменение стиля страницы в случае изенения размера окна

loomaleht, 210 просмотров

Добрый день,

Делаю сайт, на котором в случае изменения размеров окна проивходит перегруппировка блоков,

Написал вот такой код на javascript но он почему то не работает - то есть не отображает вообще ни один из стилей

window.onload = setScreen;
window.onresize = setScreen;

function setScreen(){

if (client.Width <= '1024'){
document.write ('<link href="style/start1024.css" rel="stylesheet" type="text/css">');
}

else {
if (client.Width > '1024') {
document.write ('<link href="style/start.css" rel="stylesheet" type="text/css">');
}
}
}

Ответы:

Павел Безобразов

идея такая:
1. использовать одну таблицу стилей
2. всё содержимое заключить в общий контейнер и менять стиль только этого контейнера, стили вложенных элементов будут изменяться при изменении стиля контейнера.

mr_jok

ещё лучше дать посетителям возможность самому выбирать стиль оформления и т.п.

Newone

Гуглите "Адаптивная разметка"
наверное потому что link появляется в неположенном месте.

Web

window.onload - срабатывает после загрузки всей страницы
window.onresize - опять же, чисто технически, срабатывает после загрузки всей страницы
и из-за этого у вас получается, что <link href="style/start.css" rel="stylesheet" type="text/css">:
1. при window.onload, идёт после всего кода страницы, т.е. получается вот так
...
</body>
</html>
<link href="style/start.css" rel="stylesheet" type="text/css">
2. при window.onresize, получается ещё интересней
...
</body>
</html>
<link href="style/start.css" rel="stylesheet" type="text/css">
<link href="style/start1024.css" rel="stylesheet" type="text/css">
ну и так далее, если пользователь например сначала уменьшил страницу, потом её увеличил, потом опять уменьшил...
Я бы в данном случае предложил бы наверное изменять сами свойства элементов через JS, хотя это зависит от того сколько этих свойств будет.

15 лет назад

RPI.su - самая большая русскоязычная база вопросов и ответов. Наш проект был реализован как продолжение популярного сервиса otvety.google.ru, который был закрыт и удален 30 апреля 2015 года. Мы решили воскресить полезный сервис Ответы Гугл, чтобы любой человек смог публично узнать ответ на свой вопрос у интернет сообщества.

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

Чтобы связаться с нами по любому вопросу О САЙТЕ (реклама, сотрудничество, отзыв о сервисе), пишите на почту [email protected]. Только все общие вопросы размещайте на сайте, на них ответ по почте не предоставляется.