Автор

02 01.2018
Смена стиля по времени суток и по дате

Смена стиля по времени суток и по дате


Буквально перед новым годом задался целью автоматизировать свой сайт, а именно сделать так чтобы с 15 декабря до 15 января работал один стиль CSS, а в остальное время другой!

Чётко того что именно мне надо было не нашел, но нашел вот такой вариант смены стиля по времени суток!

Итак, что нам потребуется. Во-первых, возьмите из папки вашей темы файл style.css и создайте с него 4 копии с такими названиями: styles_zakat.css, styles_rassvet.css, styles_den.css, styles_noch.css.
Вы можете сразу же внести изменения по вкусу в каждый стиль, если вдруг непонятен будет транслит:
styles_zakat.css - закат,
styles_rassvet.css - рассвет,
styles_den.css - день,
styles_noch.css - ночь.

Залейте все эти файлы в папку css вашего шаблона. 

Дублировать весь файл не обязательно! Можно оставить свой "дефолтный" который будет прописан самый первый, а потом скриптом подгружать именно нужные изменения!)

 

JavaScript

Подключаем скрипт

<script type="text/javascript">// <![CDATA[
function change(css)
{document.write('<link href=\"\/templates\/_ваш стиль_\/css\/styles'+css+'.css\" rel=\"stylesheet\">');}
var h=(new Date()).getHours();
if (h > 23 || h <7) change('_noch');//ночь
if (h > 6 && h < 12) change('_rassvet');//утро
if (h > 11 && h < 19) change('_den');//день
if (h > 18 && h < 24) change('_zakat');//вечер
// ]]></script>

Вот собственно и всё! Скрипт работает как надо! Но моей задачей было смена основного дизайна на новогодний. В принципе больших изменений в скрипте делать не надо. Вот мой пример:

<script type="text/javascript">
function change(css)
{document.write('<link href=\"\/templates\/_ваш стиль_\/css\/styles'+css+'.css\" rel=\"stylesheet\">');}
var now = new Date(),
month = now.getMonth(),
day = now.getDate();
if( (month == 11 && day >=15) || (month == 0 && day <= 15) ) change('_novogodniy');
if( (month == 0 && day >=16) || (month == 11 && day <= 14) ) change('_osnovnoy');
</script>

Вот и всё!


vk.com/club.ssdru

Подписывайтесь на нашу группу в контакте vk.com/club.ssdru


Статьи по темеJS

29 04.2013
Смена стиля по времени суток и по дате

Стало известно, что новая операционная система windows будет отличатся от своих предшественниц футуристическим дизайном меню пуск, и отсутствие кнопки вызова в низу панели задач, это весьма насторожило, ведь прежние удобства стали недоступны и приходится переучиваться, но есть и поклонники данного нововведения. Безусловно, что новый пуск стал весьма эффектно смотреться, появились новые возможности и естественно инновация в нестандартном оформлении. Не успела данная операционная система толком выйти, как появились интересные решение.


30 12.2015
Смена стиля по времени суток и по дате

Я уже публиковал урок «Нестандартные Checkbox (RadioButton) без использования JavaScript». Прекрасные кнопочки, но там используются картинки!!! В данном примере используется только CSS. Всё очень просто вы вставляете код в свой стиль и получаете стильные, а именно на мой взгляд, в современном стиле кнопки.


19 05.2017
Смена стиля по времени суток и по дате

Отзывчивый фрагмент тура с пошаговым руководством, чтобы помочь пользователям понять, как использовать ваш сайт.


11 09.2017
Смена стиля по времени суток и по дате

Смелая навигация, слайд-шоу, когда активна, заменяет текущий контент в трехмерном пространстве.


105 Публикаций

Раскрутка в соцсетях

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


Перейти в Блог

О КОМПАНИИ

Studio Design существует с 2001 года. Основной нашей деятельностью до 2007 года было видеопроизводство ( видеореклама и документальные фильмы, о чем подробно описано в нашем блоге ). С 2007 года, вот уже как лет, наша основная специфика - это создание сайтов для бизнеса или частной деятельности, веб дизайн, а также поддержка и администрирование готовых проектов. Каждая выполненная нами работа - это уникальный, а самое главное, адаптивный под все современные мобильные устройства дизайн сайта. Мы готовы создать сайт с нуля для каждого клиента с любого уголка России! Мы поможем Вам в создании, как одностраничных сайтов – визиток, так и крупных интернет магазинов или корпоративных сайтов. А все наши работы, большинство из которых действуют и по сей день!

Close

Целовальников Сергей


Веб-дизайн, HTML5, CSS3, jQuery, JavaScript, Верстка.

Верстальщик с большим опытом работы. Занимаюсь созданием сайтов с 2005 года. Постоянно обучаюсь и совершенствую свои навыки. Веду свои проекты, в том числе и данный блог.

Close