同じ画像にフェードとケーンズ効果

Question

リンクをクリックすると、ケンバーン効果とフェード効果の両方を同じ画像に配置する必要があります。

私は自分のやり方を試みましたが、それは完全には機能しません。

box1をクリックすると、最初の画像がフェードしてケンバーする必要があります。同様に2番目の画像も同じです。

両方の画像にJavaScriptを2回追加しました。私はそれを両方の画像のために一度入れておく必要がありますが、フェードとケンバーンの各画像のためにbox1とbox2の両方をクリックする必要があります。

助けてもらえますか？

This is my work. DEMO

$(document).ready(function() { 
    $('.box1').on('click', function() { 
     $('#slideimg01').addClass('zoom'),2000; 
    }); 
}); 

$(".box1").bind("click", function(e){ 
    e.preventDefault(); 
    gogo(); 
}); 

var gogo = function(){ 


$("#slideimg1 img").clone().appendTo("#slideimg1").hide().css({ position: 'absolute', top: 0, left: 0 }); 
$("#slideimg1 img:first").fadeOut(1000,'linear'); 
$("#slideimg1 img:last").fadeIn(1000,'linear'); 

}; 

Answer 1

は、私はあなたが行うにはあまりにも多くの方法がありますあなたがhttp://api.jquery.com/
約$(this), eq(), index()を読む必要が
それのそれぞれのボックスをクリックすることで、各画像にその効果を適用やりたいと思いますこれは効率的なものだと思う：
1 - インデックスを取得する
同じインデックスを持つ画像に2 - 効果を適用する

これは、ユーザが金額を選択し、ソーシャル型のものdemo

あなたが代わり