最後の項目がjQueryに達したら、.animate（）を停止

Question

divをオーバーフローで非表示に設定しました。 2つのトリガでオーバーフローでレイヤ内のアイテムをスクロールできます。

アイテムが非表示のオーバーフローdivがあります。私は、UP/DOWN要素のクリックに隠された領域内のボックスをスクロールすることができます：スクロールが最初または最後の要素に到達すると

$("#up").click(function(){ 
    $("#container").find(".box").animate({"top": "+=20px"}, "slow"); 
}); 
$("#down").click(function(){ 
    $("#container").find(".box").animate({"top": "-=20px"}, "slow"); 
}); 

<style> 
#itemsList { 
    height:60px; 
} 
.box { 
    height:20px; 
    position:relative; 
} 
</style> 

<div id="container">       
    <div id="up" class="scroll">UP</div> 
    <div id="itemsList"> 
     <div id="item1" class="box">item 1</div> 
     <div id="item2" class="box">qweqweqwe</div> 
     <div id="item3" class="box">qqqqqqqq</div> 
     <div id="item4" class="box">eeeeeee</div> 
     <div id="item5" class="box">rrrrrrrr</div> 
     <div id="item6" class="box">tttttt 11</div> 
    </div> 
    <div id="down" class="scroll">DOWN</div> 
</div> 

は、私は（）.animateを無効にする必要があります。上記のコードは動作しますが、.animate（）は停止しません。スクロール可能な要素の位置を確認するためのコードをいくつか追加しましたが（jsfiddleリンク参照）、何かを乱したようです。

ここは私のJSfiddleです。

Answer 1

あなたは「ScrollTo」jQueryプラグインになります。これは、あなたではなく任意にスクロール位置に20ピクセルを追加するよりも（動画付き）特定の項目にスクロールすることができます。

ここにはquasi-working demoがあります。 jQueryを1.7にアップデートして、scrollTo libraryhttp://jsfiddle.net/VP5Xb/12/

を含めることに注意してください。アイテムのy座標を取得し、スクロールトップの値を変更することで簡単にこれを達成できます。あなたは「ScrollTo」jQueryプラグインになっているはずです