2017-08-26 14 views
0

私はスクロールダウンしたいとID scroll0とdiv`s間まではscroll2する:JSキーボードスクロール

<div id="scroll0"></div> 
<div id="scroll1"></div> 
<div id="scroll2"></div> 

スクリプトは次のとおりです:

のindex.htmlで

、私はそのような何かを持っています

function scrollToAnchor(aid) { 
$('html,body').animate({ 
    scrollTop: aid.offset().top 
}, 'slow'); 
} 

var count = 1; 

$(document).keydown(function (event) { 
var counter = count++; 
var destinationDown = "#scroll" + counter; 
var destinationTop = destinationDown //counter--; 

if (event.keyCode === 40) { 
    //Scroll down 
    scrollToAnchor($(destinationDown)); 
} else if (event.keyCode === 38) { 
    //Scroll up 
    scrollToAnchor($(destinationTop)); 
} 
}); 

スクロールダウンは問題ありませんが、別のdivの上から上にスクロールする方法はあります。

たとえば、idがscroll0のscrollをscroll1に、scroll1をscroll0にスクロールするにはどうすればよいですか?

答えて

0

上昇を処理するには、常にカウンタをすぐにインクリメントする必要はありません。

var counter = count++; 

これは、押されたキーをワークアウト後に行われなければならない、とキーコードが38であれば、あなたはカウントから引くのではなく増加する必要があります。

ラップアラウンドも処理する必要があります.3つのdivしかスクロールしないためです。下部にあり、押し下げるとコードが現在破損しています。

私の提案は、まず次の操作を行うための指標とあなたのKeyDownイベントハンドラにあるように、あなたのカウンターを変更するには、次のようになります。

  1. チェック
  2. 押されたアップ/ダウン場合は、正しい次のインデックスをスクロールする計算0にしてから2を押すと0になります。0にして1を押すと1になります。
  3. インデックス変数を更新する
  4. 新しいインデックスにスクロールする