Javascript работает в Firefox, Chrome и Safari, но не в IE

Как говорится в названии. У меня есть два анимированных часовых пояса, которые просто не перемещаются в IE8. Есть ли что-то, что мне не хватает здесь, что влияет на анимацию в IE?Javascript работает в Firefox, Chrome и Safari, но не в IE

Часы:

(function(jQuery) 
{ 
    jQuery.fn.clock = function(options) 
    { 
    var defaults = { 
     offset: '+0', 
     type: 'analog' 
    }; 
    var _this = this; 
    var opts = jQuery.extend(defaults, options); 

    setInterval(function() { 
     var seconds = jQuery.calcTime(opts.offset).getSeconds(); 
     if(opts.type=='analog') 
     { 
     var sdegree = seconds * 6; 
     var srotate = "rotate(" + sdegree + "deg)"; 
     jQuery(_this).find(".sec").css({"-moz-transform" : srotate, "-webkit-transform" : srotate, "-ms-transform" : srotate}); 
     } 
     else 
     { 
     jQuery(_this).find(".sec").html(seconds); 
     } 
    }, 1000); 

    setInterval(function() { 
     var hours = jQuery.calcTime(opts.offset).getHours(); 
     var mins = jQuery.calcTime(opts.offset).getMinutes(); 
     if(opts.type=='analog') 
     { 
     var hdegree = hours * 30 + (mins/2); 
     var hrotate = "rotate(" + hdegree + "deg)"; 
     jQuery(_this).find(".hour").css({"-moz-transform" : hrotate, "-webkit-transform" : hrotate, "-ms-transform" : hrotate}); 
     } 
     else 
     { 
     jQuery(_this).find(".hour").html(hours+':'); 
     } 
     var meridiem = hours<12?'AM':'PM'; 
     jQuery(_this).find('.meridiem').html(meridiem); 
    }, 1000); 

    setInterval(function() { 
     var mins = jQuery.calcTime(opts.offset).getMinutes(); 
     if(opts.type=='analog') 
     { 
     var mdegree = mins * 6; 
     var mrotate = "rotate(" + mdegree + "deg)";   
     jQuery(_this).find(".min").css({"-moz-transform" : mrotate, "-webkit-transform" : mrotate, "-ms-transform" : mrotate});     
     } 
     else 
     { 
     jQuery(_this).find(".min").html(mins+':'); 
     } 
    }, 1000); 
    } 
})(jQuery); 


jQuery.calcTime = function(offset) { 
    d = new Date(); 
    utc = d.getTime() + (d.getTimezoneOffset() * 60000); 
    nd = new Date(utc + (3600000*offset)); 
    return nd; 
};

выше код то, что я нашел в Интернете, проведя далеко много времени, пытаясь получить excanvas правильно работают в IE

Если кто-то может пожалуйста исправить ошибки моего путей, это было бы очень признательно.

Отредактировано только вопрос часов анимации

источник

2012-03-28 Plastika

Какие ошибки появляются? –

Какой атрибут @type вы используете в своем теге скрипта? – brianary

@brianary

IE не поддерживает transform (Только IE9 +). Если вы работаете на IE 9 вы можете добавить -ms-transform

.css({ 
"-moz-transform" : mrotate, 
"-webkit-transform" : mrotate, 
"-ms-transform" : mrotate 
});

Для IE8 это немного усложнит. Вы должны использовать матрицу поворота, например.

// convert to radian first 
var rad = Math.PI/180 * sdegree, 
    cos = Math.cos(rad), 
    sin = Math.sin(sin); 

'-ms-filter': "progid:DXImageTransform.Microsoft.Matrix(M11="+cos+", M12="+(-sin)+", M21="+sin+", M22="+cos+", SizingMethod='auto expand')";

источник

2012-03-28 03:18:59 Rezigned

Спасибо за это, я добавил, что изменил исходное сообщение - нет ли другого способа, которым я мог бы получить эту работу с IE 8 и, возможно, ниже? – Plastika

@Plastika Я обновил ответ, включив в него решение IE8. – Rezigned

Еще раз спасибо - теперь сложная часть реализации этого на каждой из часовых рук. Если бы вы могли немного приглядеться за этим, так как я нахожусь на грани мозговой кризис! – Plastika

Смежные вопросы