• 806
  • 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, в вашей теме

Можешь почитать и вот эту статейку "Ну С Новым 2017 Годом ))))"

mistakes

Это тоже интересно

Комментирование данной новости запрещено.

Ваше мнение

какой форум лучше для вас
Результаты

Облако тегов

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