显示隐藏的元素（这是可见的）不工作在IE9中

Question

我创建了一个旋转iPhone的动画，我只有在IE9有问题，当我点击一个视频时，iPhone水平旋转，当我点击iPhone按钮，它将返回到垂直位置。然后，当iPhone以垂直位置返回时，iPhone中的元素消失，而元素应该重新出现。

此字符串照顾隐藏要素：

$([before.get(0),next.get(0),reflection.get(0),screen.get(0)]).fadeTo(100,0,function(){$([before.get(0),next.get(0),reflection.get(0),screen.get(0)]).hide(100)}); 

http://matteowebdesigner.com/test/yesimove/

请任何人都可以给我一些建议吗？

function iphoneAction(){ 
    $('<div class="mask"></div>').prependTo(Iphone.iphone); 
    var 
     mask = Iphone.iphone.find('.mask'), 
     screen = Iphone.iphone.find('.screen'), 
     next = Iphone.iphone.find('.next'), 
     before = Iphone.iphone.find('.before'), 
     reflection = Iphone.iphone.find('.reflection'); 

    mask.on('click', iPhoneHorizontal); 

    /*horizontal*/ 
    function iPhoneHorizontal(){ 
     if(Iphone.iphone.find('.videoActive').hasClass('video')){ /*control the class video*/ 
      mask.off('click', iPhoneHorizontal); 
      $([before.get(0),next.get(0),reflection.get(0),screen.get(0)]).fadeTo(100,0,function(){$([before.get(0),next.get(0),reflection.get(0),screen.get(0)]).hide(100)}); 
      Iphone.iphone.find('.ice').remove(); 
      Iphone.iphone.css('zIndex','1'); 

      //animate 
      if($.browser.msie){ 
       Iphone.iphone.stop(true,true).animate({ 
        backgroundPositionY:'-5500', 
        backgroundPositionX:'0' 
       },330,'movie',function(){ 
        mask.addClass('maskVideo'); 
        $('<div class="backTurn"></div>').prependTo(Iphone.iphone); 
        Iphone.iphone.find('.videoActive').children().clone().prependTo(mask); 
        Iphone.iphone.find('.backTurn').on('click',iPhoneVertical); 
       }); 
      } 
      else { 
       Iphone.iphone.stop(true,true).animate({ 
        backgroundPosition:'(0 -5500)' 
       },330,'movie',function(){ 
        mask.addClass('maskVideo'); 
        $('<div class="backTurn"></div>').prependTo(Iphone.iphone); 
        Iphone.iphone.find('.videoActive').children('video').clone().prependTo(mask); 
        Iphone.iphone.find('.backTurn').on('click',iPhoneVertical); 
       }); 
      } 
     } 
    } 

    /*vertical*/ 
    function iPhoneVertical(){ 
     Iphone.iphone.find('.backTurn').remove(); 
     Iphone.iphone.find('.maskVideo').children().remove(); 
     mask.removeClass('maskVideo'); 

     function iPhoneCreateElement(){ 
      //ice 
      $('<div class="ice"></div><div class="ice"></div><div class="ice"></div>').insertAfter(Iphone.iphone.find('.next')); 
      var 
       ice = Iphone.iphone.find('.ice'), 
       ice01 = ice.eq(0), 
       ice02 = ice.eq(1), 
       ice03 = ice.eq(2); 

      ice02.css('background-position', '0 -486px'); 
      ice03.css('background-position', '0 -972px'); 
      ice.css('opacity','0'); 

      Iphone.iceEffect(); 

      $([before.get(0),next.get(0),reflection.get(0),screen.get(0)]).show(100,function(){$([before.get(0),next.get(0),reflection.get(0),screen.get(0)]).fadeTo(100,1)}); 
      Iphone.iphone.css('zIndex',''); 
      mask.on('click', iPhoneHorizontal); 
     } 

     //animate 
     if($.browser.msie){ 
      Iphone.iphone.stop(true,true).animate({ 
       backgroundPositionY:'0', 
       backgroundPositionX:'0' 
      },330,'movie',iPhoneCreateElement); 
     } 
     else { 
      Iphone.iphone.stop(true,true).animate({ 
       backgroundPosition:'(0 0)' 
      },330,'movie',iPhoneCreateElement); 
     } 
    }; 
}; 

Answer 1

我决定重写代码这个问题：

 //hide 
     $(before).fadeTo(100,0,function(){$(this).hide(100);}); 
     $(next).fadeTo(100,0,function(){$(this).hide(100);}); 
     $(reflection).fadeTo(100,0,function(){$(this).hide(100);}); 
     $(screen).hide(100); 

     //show 
     $(before).fadeTo(100,1,function(){$(this).show(100);}); 
     $(next).fadeTo(100,1,function(){$(this).show(100);}); 
     $(reflection).fadeTo(100,1,function(){$(this).show(100);}); 
     $(screen).show();