0

いくつかの異なる効果でスライドショーを作成しています。この特定の効果は、画像のサイズを縮小し、フェードアウトします。しかし問題は、画像を元の状態にリセットする必要があるため、ユーザーがその画像をクリックして戻ったときに、不透明度が「0.2」のままになっていることです。とにかく、完了後にアニメーションをリセットできますか?

if (currentEffect == "glimpse") {
 $("#next").click(function() {
   if (currentSlide == 0) {
    $("#slide1").animate({
     width: "0",
     opacity: 0.2,
     borderWidth: "10px"
    }, 1000 );
    $("#slide2").fadeIn(800);
   }
 });
}
4

2 に答える 2

0

.animate()完了したときのコールバックがあります：http：//api.jquery.com/animate/

それを使ってリセットしてください。

$("#slide1").animate({
     width: "0",
     opacity: 0.2,
     borderWidth: "10px"
    }, 1000, function(){ 
      //reset the image's opacity, width, etc.
    });
于 2013-03-15T02:28:01.920 に答える
0

アニメーションが完了したら、スタイル属性を削除するだけです。

上記のソリューションのように：

$("#slide1").animate({
 width: "0",
 opacity: 0.2,
 borderWidth: "10px"
}, 1000, function(){ 
  $('#slide1').removeAttr('style');
});
于 2013-03-15T02:43:43.317 に答える