0

SliderスライドのIMGソースを変更しようとしていますが、それほど速くはありません。こんなに速いってどういう意味？スライド（）イベントでその場でIMG src属性を変更することはできますが、これは醜いので、必要ありません。before.jpgというデフォルトの画像にはfadeOutを、after.jpgという画像にはfadeInを使用するのが好きです。これらは、スライダーが最後にあるときに表示する必要があります。私はこのコードを試しました：

$(document).ready(function(){
   $('#slider').slider({
      slide: function(event, ui) {
         if(ui.value >= 50) {
             $('#image-changer').fadeOut('slow');
             $('#image-changer').attr('src', 'images/after.jpg');
             $('#image-changer').fadeIn('slow');
         }
      }
   });
});

ただし、ui.valueの値は常に50を超えるため、画像がフェードインすることがあるため、機能しません。これを実現するのに役立つものはありますか？

4

1 に答える 1

0

jQuery エフェクト メソッドは非同期で実行されます。これらの呼び出しを「チェーン」して、すべてが同時に実行されないようにする必要があります。

$('#image-changer').fadeOut('slow', 
  function() { 
    $('#image-changer').attr('src', 'images/after.jpg').fadeIn('slow'); 
  }
);

fadeOut が受け入れる 2 番目のパラメータは、アニメーションが完了したときに呼び出される関数です。

于 2012-08-10T04:30:10.050 に答える