jQueryドミノのようなスライダプラグイン

Question

私はjQueryベースのコンテンツスライダプラグインを探しています。私はthis（あまりにも多くあります）やjQueryUI sliderのようなものではありません。私が探しているものは、写真で最もよく記述することができます。

ビューポートから特定の要素をスライド（またはトランジション）し、新しい要素をその場所にスライドさせるjQueryプラグインはありますか？理想的には、いくつかの要素を順番に並べるのではなく、（並べ替え）シリーズのページに簡単に戻すことができるようにしたいと考えています。これらの要素を直線的な速度で滑らせるのではなく、緩和する能力はすばらしいでしょう。

この写真は、私が思い付くことができる最高のビジュアルである：私は私の前にいくつかを行っているとして、私は、プラグインを開発することもできますが、私は車輪の再発明避けたい知っ

、可能なら。誰もがプラグインを提案できますか？

ありがとうございます。

Answer 1

CSS3をサポートしている場合は、このようなことをやってみることもできます。また、アニメーションクラスを作成する方が良いかもしれません。

.item:nth-child(1) 
{ 
transition-timing-function   : ease-in-out;  
transition-property     : left; 
transition-duration     : 0.1s; 
transition-delay     : 0.35s; 
} 

item:nth-child(2) 
{ 
transition-timing-function   : ease-in-out;  
transition-property     : left; 
transition-duration     : 0.1s; 
transition-delay     : 0.55s; 
} 

.item:nth-child(3) 
{ 
transition-timing-function   : ease-in-out;  
transition-property     : left; 
transition-duration     : 0.1s; 
transition-delay     : 0.65s; 
} 

.item:nth-child(4) 
{ 
transition-timing-function   : ease-in-out;  
transition-property     : left; 
transition-duration     : 0.1s; 
transition-delay     : 0.75s; 
}​ 

あなたはjQueryのを使用したい場合は、私はあなたがより複雑な連鎖のアニメーションを作ることができるでしょうhttp://api.jquery.com/queue/といくつかの成功を収めてきました。未知数の子供については、slice()メソッドを使用することができます。

私はあなたがfadeOutを使用する必要はありません、それは自己実行する必要はありませんが、それはきちんと整頓だhttp://paulirish.com/2008/sequentially-chain-your-callbacks-in-jquery-two-ways/

(function hidenext(jq){ 
jq.eq(0).fadeOut("fast", function(){ 
    (jq=jq.slice(1)).length && hidenext(jq); 
}); 
})($('div')) 

で見つけた自己実行されるコードのこのスニペットを変更しました未知数の要素に「遷移」を適用する方法。ここで

がフェードアウトhttp://jsfiddle.net/NpBfJ/を使用してフィドルだ...これはおそらくあなたが望むよりも多くの仕事です... :-)スライダーに関しては

それは多くを持っているhttp://caroufredsel.dev7studios.com/、これはそこに最高の無料のものの一つでありますカスタマイズ可能な機能