Новые сообщения · Участники · Правила форума · Поиск
  • Страница 1 из 2
  • 1
  • 2
  • »
Форум о uCoz и Web » Веб-программирование и дизайн » Javascript » Смена стилей CSS
Смена стилей CSS
EstennyДата: Пятница, 04.11.2011, 13:53 | Сообщение # 1
Злой Принц
Сообщений: 3005
Репутация: 120
Социальная репутация:

Статус: Оффлайн
Многие пользователи постоянно негодуют по поводу того, как можно создать переключатель «дизайнов» у себя на сайте. Вообще, дизайн — слово, не имеющее множественного числа. Но это уже отступление от темы. Итак, чтобы сделать смену дизайна на сайте нужно менять стили CSS. Это самый оптимальный вариант. Конечно, можно поместить контент в массивы и переключать их, но человек, который не знает JS не разберется с этим. Мой же вариант прост.
В стандартной верстке должен присутствовать тег <link> который указывает браузеру путь к файлу со стилями. Этот тег мы и будем менять, а точнее путь к файлу.

Code
<link rel="stylesheet" type="text/css" href="red.css" id="changeable_styles"></link>


Как видите, помимо стандартных атрибутов я добавил id="changeable_styles". Это будет идентификатор тега <link>, который мы будем менять.
Между <head></head> установите код, который я привел ниже.

Code
<script>
function setCookie(a,b,c){if(c){var d=new Date();d.setTime(d.getTime()+(c*24*60*60*1000));var e="; expires="+d.toGMTString()}else var e="";document.cookie=a+"="+b+e+"; path=/"};function getCookie(a){var b=a+"=";var d=document.cookie.split(';');for(var i=0;i<d.length;i++){var c=d[i];while(c.charAt(0)==' ')c=c.substring(1,c.length);if(c.indexOf(b)==0)return c.substring(b.length,c.length)}return null};function eraseCookie(a){setCookie(a,"",-1)};
</script>


Этот код облегчает установку Cookies, которую мы будем использовать.

Перед </body> поставьте еще один код.

Code
<script>
+function() {
std = 'red.css'; // стандартные стили
if(getCookie('color_of_style')){var color=getCookie('color_of_style')}else{var color=std};document.getElementById('changeable_styles').href=color;
}();
</script>

Измените тут значение переменной std. У меня оно 'red.css' — это путь к стандартным стилям.

А теперь сами кнопки. Их может быть больше, но я решил на примере двух.

Code
<input type="button" onclick="setCookie('color_of_style', 'blue.css', 365); document.getElementById('changeable_styles').href = 'blue.css';" value="Blue">
<input type="button" onclick="setCookie('color_of_style', 'red.css', 365); document.getElementById('changeable_styles').href = 'red.css';" value="Red">


В этих кнопках Вам нужно лишь изменить путь к Вашим стилям ('blue.css' и 'red.css') в двух местах в каждой из кнопок, а так же то, что будет написано на кнопке.

Если Вы все сделали правильно, то переключатель стилей заработает. Удачи.
Как установить кнопки социальных сетей?


Сообщение отредактировал Estenny - Пятница, 04.11.2011, 13:54
 
MHДата: Пятница, 04.11.2011, 15:36 | Сообщение # 2
Генерал-майор
Сообщений: 394
Репутация: 61
Социальная репутация:

Статус: Оффлайн
Думаю, очень многим пригодится эта статья. Наконец то весь материал по теме в одном месте.
http://mni.my1.ru/
Подключаем iLoad3 к фотоальбому uCoz
Заменяем стандартную галерею uCoz на FancyBox
Нестандартные решения в системе uCoz
Добавляем тень для видео-плеера
Кнопка "добавить фото" в стиле Google
Вид материалов Фотоальбомы от MH
Кнопки в стиле google
"Страница с полной фотографией и комментариями" by MH
 
NabranRuДата: Среда, 09.11.2011, 13:48 | Сообщение # 3
Рядовой
Сообщений: 10
Репутация: 0
Социальная репутация:

Статус: Оффлайн
Братан это не рабочий вариант. Я пробовал. Увы.

Сообщение отредактировал NabranRu - Среда, 09.11.2011, 14:06
 
EstennyДата: Среда, 09.11.2011, 14:34 | Сообщение # 4
Злой Принц
Сообщений: 3005
Репутация: 120
Социальная репутация:

Статус: Оффлайн
NabranRu, братанов на улице искать будешь.

Покажи, что ты куда вставил?
 
NabranRuДата: Среда, 09.11.2011, 15:00 | Сообщение # 5
Рядовой
Сообщений: 10
Репутация: 0
Социальная репутация:

Статус: Оффлайн
Estenny, А смысл то оставлять нерабочий скрипт в шаблоне?
Я все ставил следуя по инструкции.

Добавлено (09.11.2011, 15:00)
---------------------------------------------
Estenny, Работает но не на ИЕ, я сначала устанавливал для ие,
<?ifnot($USER_AGENT$=="ie")?><?else?><?endif?>
но на FF работает шикарно

 
EstennyДата: Среда, 09.11.2011, 20:09 | Сообщение # 6
Злой Принц
Сообщений: 3005
Репутация: 120
Социальная репутация:

Статус: Оффлайн
NabranRu, IE 7, IE 7 (совместимый), IE 8, IE 8 (совместимый) — работает, а выше и подавно. Почитай спецификации, cookies введены очень давно.
 
UnShameДата: Среда, 09.11.2011, 23:08 | Сообщение # 7
Генералиссимус
Сообщений: 1869
Репутация: 173
Социальная репутация:

Статус: Оффлайн
кукисы даже в IE6 работают, чего уж там
Тот, кто удалит этот пост будет гореть в аду.
 
SleepWalkerДата: Четверг, 10.11.2011, 09:04 | Сообщение # 8
Admin
Сообщений: 5493
Репутация: 487
Социальная репутация:

Статус: Оффлайн
Quote (UnShame)
IE6

не произноси это слово))) Не надо больше о нем. Он уже точно свое отжил!

Time Waits For No One
 
djemNaДата: Четверг, 10.11.2011, 13:03 | Сообщение # 9
злой пингвин
Сообщений: Скрыто
Репутация: Скрыто
Социальная репутация:

Статус: Hidden
Офф

Quote (SleepWalker)
не произноси это слово)))


Если ты только о IE6, то я добавлю: Не произноси вообще это слово!))

-> Правила - тут! Читать всем!
-> Линукс - просто, красиво, юзабельно!
-> Есть вопросы? Вам сюда!

Стабильность Windows заключается в ее нестабильности. С чем я от всей души поздравляю Microsoft.
 
EstennyДата: Четверг, 10.11.2011, 17:11 | Сообщение # 10
Злой Принц
Сообщений: 3005
Репутация: 120
Социальная репутация:

Статус: Оффлайн
djemNa, 10-ый уже достаточно хорошо все воспроизводить будет. Я тестировал.
 
djemNaДата: Четверг, 10.11.2011, 17:12 | Сообщение # 11
злой пингвин
Сообщений: Скрыто
Репутация: Скрыто
Социальная репутация:

Статус: Hidden
Estenny, он что знает ксс3? хотябы так как лиса
-> Правила - тут! Читать всем!
-> Линукс - просто, красиво, юзабельно!
-> Есть вопросы? Вам сюда!

Стабильность Windows заключается в ее нестабильности. С чем я от всей души поздравляю Microsoft.
 
EstennyДата: Четверг, 10.11.2011, 17:56 | Сообщение # 12
Злой Принц
Сообщений: 3005
Репутация: 120
Социальная репутация:

Статус: Оффлайн
djemNa, да. 9 знает.
 
NabranRuДата: Пятница, 11.11.2011, 02:23 | Сообщение # 13
Рядовой
Сообщений: 10
Репутация: 0
Социальная репутация:

Статус: Оффлайн
Значить так выходит что какой то скрипт конфликтует с данным скриптом, придется все проверить. Спасибо ребята помогли.
 
EstennyДата: Пятница, 11.11.2011, 16:40 | Сообщение # 14
Злой Принц
Сообщений: 3005
Репутация: 120
Социальная репутация:

Статус: Оффлайн
NabranRu, невозможно.
 
NabranRuДата: Суббота, 12.11.2011, 14:43 | Сообщение # 15
Рядовой
Сообщений: 10
Репутация: 0
Социальная репутация:

Статус: Оффлайн
Уже сработало :) . можете посмотреть живой примет "Центр отдыха Лотос"
Думаю всем кто работает с конструктором ЮКОЗ идейку подал на мультиязычность сайта. Но на счет автора этого скрипта, кто бы он не был я лично готов отблагодарить его. И вам спасибо за активное участия в помощи в долгу не останусь. Удачи вам.
 
Форум о uCoz и Web » Веб-программирование и дизайн » Javascript » Смена стилей CSS
  • Страница 1 из 2
  • 1
  • 2
  • »
Поиск: