Javascript适用于Firefox、Chrome和Safari，但不适用于IE

Javascript works in Firefox, Chrome and Safari but not in IE

本文关键字：适用于 IE Safari 不适用 Firefox Chrome Javascript      更新时间：2023-09-26

正如标题所说。我有两个动画时钟，它们在IE8中根本不动是不是我遗漏了一些影响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 中正确工作后在网上找到的

如果有人能纠正我的错误，我将不胜感激。

编辑为仅时钟动画问题

只谈论IE，它总是由某些缺失或附加字符引起的，在鼠标悬停绑定后似乎缺少一个分号：

$('.navlinks img').mouseover(function(){
    $(this).parent().find('img:first').stop().animate({opacity:1}, 1000);
});

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')";
相关文章：