jQueryRotate - 問題在IE8

JS搗鼓什麼，我想實現：http://jsfiddle.net/g3qgS/1/jQueryRotate - 問題在IE8

陽光的形象從底部上升，然後使用jquery旋轉，其旋轉至360度。這兩個動畫在Chrome，FF，IE9中運行良好，但不在IE8中運行。

在IE8中，太陽會從底部上升到應有的位置，然後在旋轉之前，它會回到原來的位置並旋轉。我使用jQuery的旋轉插件（http://code.google.com/p/jqueryrotate/），我知道這也可以通過css3完成，但我也需要它的IE8，因此不得不這樣做。

任何有關它爲什麼在IE8中表現怪異的幫助將不勝感激。事實上，如果還有其他方法可以製作這些動畫，只要他們在IE8中工作，就會很高興知道。謝謝。

HTML：

<div class="cont">  
    <img src="http://s22.postimg.org/fjo3h0p2l/sun.png" class="sun"/> 
</div>

CSS：

.cont {background:#000; height:345px; position:relative;} 
.sun {position:absolute; bottom:0px; left:20px;}

JS：

$(window).load(function() { 
    HomePageAnimation.sunRise(); 
}); 


var HomePageAnimation = { 

    sunRise: function() { 
     $(".sun").animate(
     { "bottom": "150px" }, 
     { duration: 2000, 
      complete: function() { HomePageAnimation.rotateSun(360) } 
     }); 
    }, 

    rotateSun: function (angle) { 
     var sun = $(".sun") 
     sun.rotate({ 
      angle: 90, 
      animateTo: 360   
     }); 
    } 

};

來源

2013-10-03 whyAto8

變化

sunRise: function() { 
    $(".sun").rotate(0);

這樣：

sunRise: function() { 
    $(".sun").rotate(0); 
    $(".sun").animate(

它應該工作，我希望。

來源

2013-10-09 13:01:25 Wilq32

完美，它有效的人。非常感謝。你是一個救世主。 :-) – whyAto8

我會嘗試來包裝自己的容器的圖像：

<div class="cont" style="background:#000; height:345px; position:relative;"> 
    <div class="sun-wrap" style="position:absolute; bottom:0px; left:20px;"> 
     <img src="http://s22.postimg.org/fjo3h0p2l/sun.png" class="sun"/> 
    </div> 
</div>

然後動畫包裝，而不是像

<script type="text/javascript"> 
    $(window).load(function() { 
     HomePageAnimation.sunRise(); 
    }); 


    var HomePageAnimation = { 

     sunRise: function() { 
      $(".sun-wrap").animate(
        { "bottom": "150px" }, 
        { duration: 2000, 
         complete: function() { HomePageAnimation.rotateSun(360) } 
        }); 
      }, 

     rotateSun: function (angle) { 
      var sun = $(".sun") 
      sun.rotate({ 
       angle: 90, 
       animateTo: 360 
      }); 
     } 

    }; 
</script>

我不完全知道是什麼事情在IE8，但希望這將有助於

來源

2013-10-03 17:43:09 eivers88

我試過了，但沒有奏效。包裹在一個div中，但它根本沒有旋轉，只是略微下降了一點。 – whyAto8

jQueryRotate - 問題在IE8

回答

相關問題