2743
- 0
- Адаптировал: irbees2008
- Уровень сложности исполнения: нужны навыки css html
Вот покапался на просторах инета и нашел скрипт смены стилей по времени.Сейчас и разберем как их установить.
И так задача сделать два файла стиля day.css и night.css,один для дневного оформления,второй для ночного оформления.
Один из них будет основным и подключаем его в секцию HEAD
Код:
<link id="style" rel="stylesheet" type="text/css" href="css/day.css" />
Код:
<script type="text/javascript">
var date = new Date(); // Получаем текущие дату и время
var h = date.getHours(); // Получаем текущий час
if (h < 8 || h > 21) document.getElementById("style").href = "css/night.css"; // Если сейчас ночь, то меняем файл стилей
</script>
Вот еще бонус смена фона 4 раза
Код:
<script type="text/javascript">
theTime = new Date();
theHour = theTime.getHours();
theMinute = theTime.getMinutes();
if(theHour>=9&&theHour<=17){
document.body.style.cssText = "background: #59b0ee url('http://site.ru/public/style_images/vash_stil/_backgrounds/bg1.jpg') top center repeat-x";
}
else if(theHour>6&&theHour<9){
document.body.style.cssText = "background: #26abf6 url('http://site.ru/public/style_images/vash_stil/_backgrounds/bg2.jpg') top center repeat-x";
}
else if(theHour>17&&theHour<21){
document.body.style.cssText = "background: #26abf6 url('http://site.ru/public/style_images/vash_stil/_backgrounds/bg3.jpg') top center repeat-x";
}
else{
document.body.style.cssText = "background: #155e87 url('http://site.ru/public/style_images/vash_stil/_backgrounds/bg4.jpg') top center repeat-x";
}
</script>
Можешь почитать и вот эту статейку "Ставим вертикальное выпадающие меню на CSS"
Это тоже интересно
05.12.13Загрузка новостей на AJAX
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.