Heim > Artikel > Web-Frontend > Code für den Effekt der olympischen Countdown-Uhr, implementiert in js_javascript-Fähigkeiten

Code für den Effekt der olympischen Countdown-Uhr, implementiert in js_javascript-Fähigkeiten

WBOYOriginal: 2016-05-16 15:26:581451Durchsuche

Das Beispiel in diesem Artikel beschreibt den in js implementierten olympischen Countdown-Uhr-Effektcode. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Der Screenshot des Laufeffekts sieht wie folgt aus:

Der spezifische Code lautet wie folgt:

<html> 
<head> 
 <title>js倒计时</title> 
 <SCRIPT language=JavaScript1.2> 
function setcountdown(theyear,themonth,theday){ 
yr=theyear;mo=themonth;da=theday 
} 
setcountdown(2016,8,5) 
var occasion="2016巴西奥运会" 
var message_on_occasion="盼望已久的时刻终于来到了!" 
var countdownwidth='480px' 
var countdownheight='20px' 
var countdownbgcolor='tan' 
var opentags='<font face="宋体"><small>' 
var closetags='</small></font>' 
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec") 
var crosscount='' 
function start_countdown(){ 
if (document.layers) 
document.countdownnsmain.visibility="show" 
else if (document.all||document.getElementById) 
crosscount=document.getElementById&&!document.all&#63;document.getElementById("countdownie") : countdownie 
countdown() 
} 
if (document.all||document.getElementById) 
document.write('<span id="countdownie" style="width:'+countdownwidth+'; background-color:'+countdownbgcolor+'"></span>') 
window.onload=start_countdown 
function countdown(){ 
var today=new Date() 
var todayy=today.getYear() 
if (todayy < 1000) 
todayy+=1900 
var todaym=today.getMonth() 
var todayd=today.getDate() 
var todayh=today.getHours() 
var todaymin=today.getMinutes() 
var todaysec=today.getSeconds() 
var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec 
futurestring=montharray[mo-1]+" "+da+", "+yr 
dd=Date.parse(futurestring)-Date.parse(todaystring) 
dday=Math.floor(dd/(60*60*1000*24)*1) 
dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1) 
dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1) 
dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1) 
if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=1&&todayd==da){ 
if (document.layers){ 
document.countdownnsmain.document.countdownnssub.document.write(opentags+message_on_occasion+closetags) 
document.countdownnsmain.document.countdownnssub.document.close() 
} 
else if (document.all||document.getElementById) 
crosscount.innerHTML=opentags+message_on_occasion+closetags 
return 
} 
else if (dday<=-1){ 
if (document.layers){ 
document.countdownnsmain.document.countdownnssub.document.write(opentags+"时间已经过了!"+closetags) 
document.countdownnsmain.document.countdownnssub.document.close() 
} 
else if (document.all||document.getElementById) 
crosscount.innerHTML=opentags+"Occasion already passed! "+closetags 
return 
} 
else{ 
if (document.layers){ 
document.countdownnsmain.document.countdownnssub.document.write(opentags+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+occasion+closetags) 
document.countdownnsmain.document.countdownnssub.document.close() 
} 
else if (document.all||document.getElementById) 
crosscount.innerHTML=opentags+"还有 "+dday+ " 天, "+dhour+" 小时, "+dmin+" 分, "+dsec+" 秒 就是 "+occasion+closetags 
} 
setTimeout("countdown()",1000) 
} 
</SCRIPT> 
<SCRIPT type="text/javascript" src=""></SCRIPT> 
<SCRIPT language="JavaScript"> 
<!--  
BaiduWriteAD("zouwenyedg","3"); 
//-->  
</SCRIPT> 
</head> 
<body> 
<ILAYER id=countdownnsmain visibility="hide" bgColor="&{countdownbgcolor};"  
height="&{countdownheight};" width="&{countdownwidth};"><LAYER  
id=countdownnssub height="&{countdownheight};"  
width="&{countdownwidth};" top="0" left="0"></LAYER></ILAYER> 
</body> 
</html>

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die sich mit der JavaScript-Programmierung befassen.

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Ausführliche Erklärung, wie js die Mausposition erhält, example_javascript-FähigkeitenNächster Artikel：Ausführliche Erklärung, wie js die Mausposition erhält, example_javascript-Fähigkeiten

In Verbindung stehende Artikel

Mehr sehen