FadeOut回调函数正在执行后，fadeOut结束

点击一个按钮，我试图淡出一个图像，当它淡出时，我正在改变图像的来源。然后我使用淡入来显示新图像。这在Chrome和Firefox中运行良好。但是，在ie10中，图像淡出，淡入，然后出现新图像。我找不到它的修复程序。我试图延长fadeOut，fadeIn的持续时间。我试过使用setTimeout函数。我试过使用promise（）。done（）函数。我试过使用JQuery UI的隐藏/显示w /幻灯片效果，并出现相同的问题。似乎没有任何工作。我非常感谢任何帮助。由于FadeOut回调函数正在执行后，fadeOut结束

me.$el.find('#printable-detail-static-imageRight').fadeOut('fast', function(){ 
          me.$el.find('#printable-detail-static-imageRight').attr('src', me.options.samplePrints[k+i]); 
          me.disableNext(); 
         }); 

         me.$el.find('#printable-detail-static-imageRight').fadeIn('slow')

来源

2013-07-04 user1801879

这是因为没有加载图像？尝试在您的页面中显示第二张图片的img标签，以便测试它。 – rorypicko

也不需要'我。$ el.find（'＃printable-detail-static-imageRight'）'在淡入淡出out功能。使用'$（this）' – rorypicko

我敢肯定，你需要把.fadeIn方法的回调函数内，以便为它回调函数的影响。实际上，我会为.attr方法添加另一个回调函数，以确保只有在更改了src之后才能淡入。

Here's我写了一个jsFiddle来说明我的意思。

来源

2013-07-04 01:43:05 Turtleweezard

谢谢，这是很大的帮助 – user1801879

@Turtleweezard ...这段代码适用于其他浏览器，但在ie上。即仍然淡出，淡入，然后图像正在变化。而在铬和Firefox上，它完美的作品。 – user1801879

当。我真的希望我对jQuery有足够的了解来解决这个问题......“为你提供Internet Explorer !!!” – Turtleweezard

我在一个mac，但是这个代码在ie中工作吗？ jsFiddle

的.html

<div id="content">Promises</div> 
<button id="click">start animation</button>

的.js

$("#click").on("click", function() { 
    $('#content').fadeOut({ 
     duration: 1000, 
     // run when the animation is complete 
     complete: function() { 
      $("#content").append($("<div>").addClass("fakeimg")); 
     }, 
     // run when the animation is complete + 
     //it's promise is resolved 
     done: function() { 
      $('#content').fadeIn(1000); 
     } 
    }); 
});

来源

2013-07-04 08:48:09 rusln

但是当你试图改变图像的src属性时它会工作吗？ – Turtleweezard

@Turtleweezard肯定http://jsfiddle.net/Rusln/b36Jp/ – rusln

在这种情况下，我同意这种解决方案。 +1 – Turtleweezard

这个工程：

me.$el.find('#printable-detail-static-imageRight').animate({ 
         opacity:0 
        }, { 
         duration: 700, 
         step: function(now, fx){ 
          if(fx.pos > 0.40 && fx.pos < 0.5){ 
           $(this).attr('src', me.options.samplePrints[k+i]); 
           me.disableNext(); 
          } 
          if (fx.pos ==1) { 
           $(this).animate({ 
            opacity:1 
           }, 200); 
          } 
         } 
        });

来源

2013-07-05 17:09:58 user1801879

FadeOut回调函数正在执行后，fadeOut结束

回答

相关问题