1

I have an awesome count down clock which works fine in chrome but does not work at all in IE. Thanks to Stack overflow user Roko for helping me out to put together the project. Would anyone have any idea how to get this work on IE?

Here is the JS

var fut = new Date("Dec 19 2013 21:15:00 UTC-05:00")
    obj = {};

// Number splitter
function intSpl( i ){
  i = Math.floor(i);
  return [~~(i/10), i%10];  
}

function drawTime(){  
  var now = new Date().getTime(),   
      dif = now<fut ? Math.floor( (fut-now)/1000) : 0;
  obj.s = intSpl(dif % 60);
  obj.m = intSpl(dif/60 % 60);
  obj.h = intSpl(dif/60/60 % 24);
  obj.d = intSpl(dif/60/60/24);  

  for(var key in obj){    
     if(obj.hasOwnProperty(key)){
        for(var i=0; i<2; i++){ 
            $('#'+ key+i).css({backgroundPosition: -obj[key][i]*50 });
        }
     }    
  }  
}
drawTime(); 
setInterval(drawTime, 1000);

Here is the fiddle http://jsfiddle.net/qLTE2/7/

4

1 回答 1

0

你可以试试这个，原因是 IE 不支持 dateformat，我在 IE8 中测试过。它工作正常。var fut = new Date(Date.UTC(2013, 12, 19, 21, 15, 0));//改变格式，即日期格式应该是-new Date(year, month [, day, hour, minute, second, millisecond]);

参考：关于日期的链接：https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date?redirectlocale=en-US&redirectslug=JavaScript%2FReference%2FGlobal_Objects%2FDate

//var fut = new Date("Dec 19 2013 21:15:00 UTC-05:00");

var fut = new Date(Date.UTC(2013, 12, 12, 21, 15, 0)); //format - new Date(year, month [, day, hour, minute, second, millisecond]);
obj = {};

//Number splitter
function intSpl( i ){
    i = Math.floor(i);
    return [~~(i/10), i%10];  
}




function drawTime(){  
    var now = new Date().getTime(); 

    var  dif = now<fut ? Math.floor( (fut-now)/1000) : 0;

    console.log("fut::"+fut +":::now"+now); // fut is NaN thats why it is not working

    obj.s = intSpl(dif % 60);
    obj.m = intSpl(dif/60 % 60);
    obj.h = intSpl(dif/60/60 % 24);
    obj.d = intSpl(dif/60/60/24);  


        for(var key in obj){    
              if(obj.hasOwnProperty(key)){
                 for(var i=0; i<2; i++){ 
                     $('#'+ key+i).css({backgroundPosition: -obj[key][i]*50 });       

                     console.log(key+":::"+i+':::PX set'+ -obj[key][i]*50);
                 }
              }    
        }  
    }

    drawTime(); 
    setInterval(drawTime, 1000);

CSS：

    #clock span{
      display:inline-block;
      width:50px;
      height:85px;
      background-image:url('time.jpg');
      background-position:0 0;
      /*background-color: #ffff00;*/ //added for testing
    }

演示：http: //jsfiddle.net/qLTE2/8/

于 2013-11-08T05:34:23.337 回答