Блог Дмитрия Волотко Подпишись на обновления!
JS 22 February 2008
Метки: , ,

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

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

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

Многие видели в сети и писали скрипты, которые здороваются с посетителем по разному, в зависимости от времени суток (“доброе утро”, “добрый день”, “привет тебе, человек с бессонницей”). Но можно пойти дальше, меняя оформление сайта, путём переключателя 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>

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

Так же можно почитать:



# 25 February 2008 в 22:44

WinKi

За скрипт респект. Попробую внедрить. ^_^

# 25 February 2008 в 23:28

admin

^_^

# 19 March 2008 в 13:48

Guvatara

Огромное спасибо за скрипт.
сам скрипт видел на хабре, но потерял.

# 19 March 2008 в 13:51

Guvatara

Думаю если я его описание похищу, с указанием места похищения, не сильно обидитесь.

# 19 March 2008 в 13:56

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

Guvatara, пожалуйста.
Конечно берите и похищайте.

# 12 May 2008 в 17:18

Никита

отличный скрипт!) тоже похищаю с целью описи в блоге)

# 12 May 2008 в 17:32

Nik’s Blog » Смена темы сайта в зависимости от времени суток

[...] Как уважающий себя дизайнер, чья голова даже в самые трудные времена набита хорошими идеями, я не смог спокойно пройти мимо следующего поста. [...]

# 12 May 2008 в 17:32

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

Никита, а если на меня ещё и ссылочку поставите, я вам больше спасибо скажу! )

# 30 May 2008 в 13:07

Серега

Ха! Здорово! Отлично! Спасибо, классный эффект! =)

# 22 July 2008 в 0:16

antonP

ОООО давно себе хател чтонить падобное сделать =) Теперь не забуду!!! ))))))

# 22 July 2008 в 0:54

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

@antonP, всегда пожалуйста!



* Должны быть заполнены.
Из-за дикого спама, и нежелания ставить капчу оставлять ссылку у комментария вообще нельзя. Точно так же нельзя оставлять ссылки в теле комментария.