2

同様の質問がなされたことは知っていますが、私のジレンマを解決するものはないようです。だからここに行きます!

上下の矢印キーを使用して移動したいページにセクションがあります。最初のものは「ヘッダー」と呼ばれ、残りは「モジュール」と呼ばれます。スクロール時に「ヘッダー」と「モジュール」を区別する問題は言うまでもなく、「次へ」の数値を更新するのに問題があります。

これが私のHTMLです

<div id="pages">
    <div class="header"></div>
    <div class="module"></div>
    <div class="module"></div>
    <div class="module"></div>
    <div class="module"></div>
</div>

そして私のJQuery

$(document).keydown(function (e) {

var keyCode = e.keyCode || e.which,
    arrow = {left: 37, up: 38, right: 39, down: 40 },       
    elements = $(".module,.header"),
    next = 0,
    max = elements.length;

switch (keyCode) {
    case arrow.down:
        if(next+1 < max) {
            next++;
            $("#pages").scrollTo(elements[next], 800, { axis:"y" });
            console.log(next);
        }
    break;

    case arrow.up:
        if(next-1 > -1) {
            next--;
            $("#wrap").scrollTo(elements[next], 800, { axis:'y' });
        }
    break;
}

}); 

どんな助けやアドバイスも大歓迎です!

4

0 に答える 0