ITPub博客

首页 > IT职业 > IT图书 > 兼容各种浏览器的倒计时效果

兼容各种浏览器的倒计时效果

原创 IT图书 作者:chunzhisu 时间:2014-11-04 11:43:28 0 删除 编辑

点击(此处)折叠或打开

  1. <!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
  2. <html xmlns=\"http://www.w3.org/1999/xhtml\">
  3. <head>
  4. <title>兼容各种浏览器的倒计时效果-格栅除污机-石家庄化妆造型</title>
  5. <meta http-equiv=\"content-type\" content=\"text/html;charset=gb2312\">
  6. <!--把下面代码加到与之间-->
  7. <style style=\"text/css\">
  8. .lcdstyle{
  9.     background-color:black;
  10.     color:yellow;
  11.     font:bold 18px MS Sans Serif;
  12.     padding:3px;
  13. }
  14. .lcdstyle sup{
  15.     font-size:80%;
  16. }
  17. </style>
  18. <script type=\"text/javascript\">
  19. function cdtime(container, targetdate){
  20.     if (!document.getElementById || !document.getElementById(container)) return
  21.     this.container=document.getElementById(container)
  22.     this.currentTime=new Date()
  23.     this.targetdate=new Date(targetdate)
  24.     this.timesup=false
  25.     this.updateTime()
  26. }
  27. cdtime.prototype.updateTime=function(){
  28.     var thisobj=this
  29.     this.currentTime.setSeconds(this.currentTime.getSeconds()+1)
  30.     setTimeout(function(){thisobj.updateTime()}, 1000) //update time every second
  31. }
  32. cdtime.prototype.displaycountdown=function(baseunit, functionref){
  33.     this.baseunit=baseunit
  34.     this.formatresults=functionref
  35.     this.showresults()
  36. }
  37. cdtime.prototype.showresults=function(){
  38.     var thisobj=this
  39.     var timediff=(this.targetdate-this.currentTime)/1000
  40.     if (timediff<0){
  41.         this.timesup=true
  42.         this.container.innerHTML=this.formatresults()
  43.         return
  44.     }
  45.     var oneMinute=60 //minute unit in seconds
  46.     var oneHour=60*60 //hour unit in seconds
  47.     var oneDay=60*60*24 //day unit in seconds
  48.     var dayfield=Math.floor(timediff/oneDay)
  49.     var hourfield=Math.floor((timediff-dayfield*oneDay)/oneHour)
  50.     var minutefield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour)/oneMinute)
  51.     var secondfield=Math.floor((timediff-dayfield*oneDay-hourfield*oneHour-minutefield*oneMinute))
  52.     if (this.baseunit==\"hours\"){ //if base unit is hours, set \"hourfield\" to be topmost level
  53.         hourfield=dayfield*24+hourfield
  54.         dayfield=\"n/a\"
  55.     }
  56.     else if (this.baseunit==\"minutes\"){
  57.         minutefield=dayfield*24*60+hourfield*60+minutefield
  58.         dayfield=hourfield=\"n/a\"
  59.     }
  60.     else if (this.baseunit==\"seconds\"){ //if base unit is seconds, set \"secondfield\" to be topmost level
  61.         var secondfield=timediff
  62.         dayfield=hourfield=minutefield=\"n/a\"
  63.     }
  64.     this.container.innerHTML=this.formatresults(dayfield, hourfield, minutefield, secondfield)
  65.     setTimeout(function(){thisobj.showresults()}, 1000) //update results every second
  66. }
  67. function formatresults(){
  68.     if (this.timesup==false){//if target date/time not yet met
  69.         var displaystring=arguments[0]+\" days \"+arguments[1]+\" hours \"+arguments[2]+\" minutes \"+arguments[3]+\" seconds left until March 23, 2009 18:25:00\"
  70.     }
  71.     else{ //else if target date/time met
  72.         var displaystring=\"Future date is here!\"
  73.     }
  74.     return displaystring
  75. }
  76. function formatresults2(){
  77.     if (this.timesup==false){ //if target date/time not yet met
  78.         var displaystring=\"\"+arguments[0]+\" days \"+arguments[1]+\" hours \"+arguments[2]+\" minutes \"+arguments[3]+\" seconds left until this Christmas\"
  79.     }
  80.     else{ //else if target date/time met
  81.         var displaystring=\"\" //Don\

来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/29737856/viewspace-1319843/ ,如需转载,请注明出处,否则将追究法律责任。

下一篇: 十二个月特效
请登录后发表评论 登录
全部评论

注册时间:2014-07-04

  • 博文量
    95
  • 访问量
    122208