Webmasters.BY

Главная Статьи Веб-программирование Изменение дизайна сайта в зависимости от времени суток
Изменение дизайна сайта в зависимости от времени суток
Рейтинг пользователей: / 7
ХудшийЛучший 
02.09.2008 16:28

Изменение внешнего вида сайта в зависимости от времени суток это довольно интересный способ придать некоторую изюминку вашему сайту.
Реализовать это можно довольно просто с помощью javascript.

Представленный ниже код позволяет менять оформление сайта каждые 3-4 часа, основываясь на времени пользователя.

<script type="text/javascript"> 

 function getCSS() 
 {  
 datetoday = new Date(); 
 timenow=datetoday.getTime(); 
 datetoday.setTime(timenow); 
 thehour = datetoday.getHours();

 if (thehour > 20) 
 display = "tree_twilight.css"; 
 else if (thehour > 17) 
 display = "tree_sunset.css"; 
 else if (thehour > 14) 
 display = "tree_afternoon.css"; 
 else if (thehour > 11) 
 display = "tree_noon.css"; 
 else if (thehour > 7) 
 display = "tree_morning.css"; 
 else if (thehour > 4) 
 display = "tree_sunrise.css"; 
 else if (thehour > 1) 
 display = "tree_twilight.css"; 
 else 
 display = "tree_sunset.css";

var css = '<';  css+='link rel="stylesheet" href=' + display + ' \/';  css+='>'; 
 
 document.write(css); 
 // End --> 
 } 
 </script> 
 <script type="text/javascript">getCSS();</script>
 

Все что требуется от вас, так это написать соответствующие стили.

Для людей которые отключают javascript можно добавить стили используемые по-умолчанию:

<noscript> 
<link rel="stylesheet" href="/tree_sunset.css" type="text/css"> 
</noscript>

Источник: http://www.katgal.com/2007/03/time-sensitive-css-switcher-change.html

Добавить комментарий


Защитный код
Обновить

Если вы заметили ошибку в тексте новости, пожалуйста, выделите её и нажмите Ctrl+Enter

Если у Вас возникли вопросы, то для скорейшего получения ответа рекомендуем воспользоваться нашим форумом
Обновлено 31.10.2008 13:42
 

Апельсин-1

Голосование

Ваш любимый html-редактор?

Новые файлы

Шпаргалка по HTML5 Canvas

Archive - бесплатный кириллический шрифт

Шпаргалка по HTML5 атрибутам обработчиков событий

См. также

activecloud.ru

TisRef

Баннер

Видеоуроки

Система Orphus

Кто онлайн

Сейчас 71 гостей онлайн

Комментарии

Статистика
Webmasters.BY © 2008 - 2012