Хаки и Скрипты Next Generation CMS

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

irbees2008 irbees2008 Опубликовано - 13 - марта Время, дата, календарь
1863 - 0
  • Адаптировал: irbees2008
  • Уровень сложности исполнения: нужны навыки css html

Продолжение темы смены оформления сайта,или фона сайта по времени.Ну сегодня я покажу как сменить фон в зависимости от времени суток. Я уже показывал вариант на твиге но он был большим, этот код поменьше и проще, и использует только дату на твиге. Ну шпаргалка по дате здесь, с её помощью можно еще кучу настроек с датой попробывать.

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

Код:
class="time-{{ now|date("G") }}"

Теперь откроем файл style.css и добавим нужную нам шапку, например:

Код:
/* Ночь */
.time-23 , .time-00 , .time-01, .time-02, .time-03, .time-04, .time-05
{
background:url (../images/night.jpg);
}
/* Утро */
.time-06 , .time-07 , .time-08, .time-09, .time-10, .time-11
{
background:url (../images/morning.jpg);
}
/* День */
.time-12 , .time-13 , .time-14, .time-15, .time-16, .time-17, .time-18
{
background:url (../images/day.jpg);
}
/* Вечер */
.time-19 , .time-20 , .time-21, .time-22
{
background:url (../images/evening.jpg);
}

Картинки night.jpg, morning.jpg, day.jpg, evening.jpg разместите в папке images, в вашей теме

Можешь почитать и вот эту статейку "Что такое gzip"

Опрос

Ваше мнение

Как вам наш дизайн сайта?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 3324 дня
  • Новостей: 542
  • Комменты: 254
  • Зарегистрированно : 571
  • Онлайн всего: [7]
  • Гости: [7]
  • Были сегодня : [4] Яндекс, Google, selischev, irbees2008
  • SQL запросов: 30
  • Генерация страницы: 0.084сек
  • Потребление памяти: 4.932 Mb 
  •   яндекс.ћетрика