Автор

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

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

Профессиональный веб-дизайн не обходится без создания цветовой схемы. Во всемирной паутине существует множество инструментов для достижения цветовой «нирваны». Кажется, что они совершенно разные, но многие из них – всего лишь измененные версии более популярных и полезных инструментов.


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

Длинные тени — это последний тренд в веб-дизайне. Этот стиль на сегодняшний день стремительно набирает популярность. Итак. К вашему вниманию CSS3 генератор длинных теней. Он имеет возможность создавать стиль как для текста, так и для изображения. С помощью ползунков можно подстроить длину и рассеивания тени по своему усмотрению, а так же настроить цвета.


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

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


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

Формат SVG делает сайт, более интересным. Это действительно много творческих возможностей для интересных эффектов на веб-сайт с использованием SVG. Сегодня мы хотели бы поделиться с вами двумя экспериментальными понятиями, которые используют анимацию, ставших популярными благодаря анимации на PlayStation 4 и Xbox одновременно.


105 Публикаций

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

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


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

О КОМПАНИИ

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

Close

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


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

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

Close