→ При разработке сайта лендинг в подарок! ЖМИ! ←
Янв
10

Смена фона страницы сайта в зависимости от времени суток

Вот такая возникла задача: сделать автоматическую смену фона сайта в зависимости от времени суток (к примеру, ночь-день). Решается данная задача несложно: мы получаем текущее время, затем получаем доступ к необходимому элементу страницы (в нашем случае это будет body), и «подмешиваем» к нему нужный класс, в котором прописываем нужные нам настройки для фонового изображения. Вот алгоритм решения смены фона сайта в зависимости от времени суток. Теперь будем реализовывать.

Для начала возьмем небольшой кусочек html-файла. Интересующему элементу обязательно нужно прописать ID, именно так мы к нему получим доступ

1
 

Затем подготовим нужные нам классы и пропишем их в css

1
2
.body01{background: #000 url(01.jpg) no-repeat fixed;}
.body02{background: #000 url(02.jpg) no-repeat fixed;}

Ну и напоследок сам js файл, реализующий данный функционал.

1
var date=new Date(),h=date.getHours(),obj=document.getElementById('pagebody');if(h>0&&h<9) {obj.className+=' body01';}else{obj.className+=' body02';}

Вот и всё!

Самое время отдохнуть: Ловля на поплавок, советы опытных рыбаков.

3 коммент. к записи “Смена фона страницы сайта в зависимости от времени суток”

  • Paskuda 7 марта 2012 - 16:59

    Ни хера не работает. Гавно! Лучше выложи готовый пример с файлами. А просто так писать все могут.

  • K_E_V_in 8 марта 2012 - 1:25

    Кривым рукам поможет батарея! Вот здесь это реализовано

  • Алексей 29 июня 2013 - 10:12

    Вот скрипт с использованием условий http://in.ucoz.org/news/smena_fona_po_vremeni_sutok_na_jukoz/2013-06-12-240
    Использовать можно как цвета так и картинки.

Прокомментировать

Рубрики

Наши услуги

В прямом эфире