js实现的奥运倒计时时钟效果代码

前端技术 2023/09/09 JavaScript

本文实例讲述了js实现的奥运倒计时时钟效果代码。分享给大家供大家参考,具体如下:

运行效果截图如下:

具体代码如下:

<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?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>

希望本文所述对大家JavaScript程序设计有所帮助。

本文地址:https://www.stayed.cn/item/23740

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。