Таймер за обратно броене

В този урок ще се научим сами да създаваме таймер за обратно броене. Таймерът ще свържем с събитие, което ще настъши след изтичане на времето. В случая наближаващо такова е настъпващата нова 2010 година. До този момент на посетителите на блога или сайта ще им показваме оставащото време, а при настъпване ще ги върнем...тук, на тази страница, съответно вие по избор на ваша. Удачно приложение на таймера е когато подготвяме сайт. На страницата на бъдещия сайт инсталираме таймера и той информира посетителите за оставащото време до откриване.

За собствени нужди търсех в мрежата начин за създаване на таймер за обратно броене. Проблемът на всички предложения бе, че съдържаха воден знак или бяха неугледни. Търсенето се увенча с успех и реших да го споделя с вас, читателите.

На нужното место, където планираме да изведем таймера подключваме този скрипт. Неговите стойности повтарят съдържанието на показания пример.

<SCRIPT language="JavaScript" SRC="countdown.php?timezone=Asia/Yekaterinburg&countto=2010-12-31 00:00:00&do=r&data=http://profruit.blogspot.com">
</SCRIPT>

В този ред се извършват всички настройки на скрипта чрез GET - параметри:

• timezone = - Вашата часова зона. Моята например е Asia/Yekaterinburg (т.е. GMT + 5:00). За точно определяне на часовата ви зона на помощ е този сайт.
• countto = - Час Х, т.е. времето, в което ще настъпи нашето знаменателно събитие в формат ГГГГ-ММ-ДД ЧЧ:ММ:СС
• do=t&data може да приема 2 значения:
• do=t&data= - Текст, който ще се изобразява при настъпване на час Х вместо таймера
• do=r&data=  - Когато настъпи час X, ще изпрати посетителя на даден адрес, например : http://profruit.blogspot.com

Нещата оформяме чрез стил. В случая идентификатор cd.
Кодът не представлява някаква особеност и подлежи на редакция според вашите условия:

#cd

margin: auto;
width: xx_px;
height: xx_px;
font-family: "Courier New", Courier, mono;
font-size: 24pt;
font-weight: bold;
color: #000;
text-align: center;
background-image: url(url_back.jpg);

Финал на нашите действия е връзване на php скрипт - countdown.php в java скрипта. РНР-скриптът е готов благодарение на Kidino.
Изтеглете този скрипт и го качете на сайт с РНР поддръжка, а после посочете пътя до него в java-скрипта.

Download countdown.php

До рожденния ми ден остават

до нови срещи   ^.^

04.11.2009 profruit