Question

我已经绞尽脑汁看了很多年，并且没有看到堆叠溢出，但是我觉得这样有一个答案......

我在Chrome和Firefox中有一个工作的模拟时钟，但它在IE中无效。它使用js从本地计算机获取时间，然后使用css transform：rotate相应地旋转手。下面是剧本：

<script type="text/javascript">

    $(document).ready(function() {

          setInterval( function() {
          var seconds = new Date().getSeconds();
          var sdegree = seconds * 6;
          var srotate = "rotate(" + sdegree + "deg)";

          $("#sec").css({"-moz-transform" : srotate, "-webkit-transform" : srotate, "-ms-transform":srotate});

          }, 1000 );


          setInterval( function() {
          var hours = new Date().getHours();
          var mins = new Date().getMinutes();
          var hdegree = hours * 30 + (mins / 2);
          var hrotate = "rotate(" + hdegree + "deg)";

          $("#hour").css({"-moz-transform" : hrotate, "-webkit-transform" : hrotate, "-ms-transform":hrotate});

          }, 1000 );


          setInterval( function() {
          var mins = new Date().getMinutes();
          var mdegree = mins * 6;
          var mrotate = "rotate(" + mdegree + "deg)";

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

          }, 1000 );

    }); 

</script>

Answer 1

据我所知，IE（v9及以上版本）中transform的正确使用是：

transform: rotate(45deg);

如果您使用的是IE 8或更低版本，则需要使用progid:DXImageTransform.Microsoft.Matrix()方法（由于您必须使用SIN和COS数学值，因此可能会出错）。这种方式适用于filter和-ms-filter。

的css属性

看一下这篇文章，它会更深入地解释它，但你需要将DXImageTransform值转换为动态的。

CSS rotate property in IE

JS CSS Clock在IE中不起作用

1 个答案: