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

С

Подобное конечно не новинка, и технически совершенно не сложно, но возможно кому то это покажется интересным и нужным.

Сразу отмечу, что меня побудил написать пост этот блог.

Многие видели в сети и писали скрипты, которые здороваются с посетителем по разному, в зависимости от времени суток («доброе утро», «добрый день», «привет тебе, человек с бессонницей»). Но можно пойти дальше, меняя оформление сайта, путём переключателя CSS.
Вот к чему мы будем стремиться:

Были выбраны следущие промежутки времени:
С пяти утра, до восьми;
С восьми утра, до полудня;
С полудня, до трёх дня;
С трёх дня, до шести вечера;
С шести вечера, до девяти;
С девяти вечера до пяти утра;
Изменять и дополнять эти промежутки времени труда не составит.

Сам код:

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
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 language=»javascript»>getCSS();</script>

Устанавливаем один из стилей как дефолтный, на случай, если у пользователя отключен JS.

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

Ну и приготовьте все нужные стили, без них не зафурычит :)
Вот в общем и всё.

Дмитрий Волотко

Метки

Страницы