javascript - OnePage Scroll 自定义导航

Question

我建了这个网站http://www.graphink.be我在哪里使用 OnepageScroll 插件。我遇到了插件最奇怪的行为。

我将自定义导航挂接到滚动效果。

当我单击导航链接时，向下按各部分，插件将在每次单击时自动跳过一个部分。

含义:点击第二个链接，它会移动到第三个，点击第三个，它会移动到第四个，依此类推，点击最后一个链接时会创建一个空白部分。

最奇怪的是，它似乎在 UP 链接后工作正常......

这是我为自定义导航创建的小 js:

$(document).ready(function(){

$("nav > input").click(function(){
$(".content").moveTo($(this).data("target"));
});


// Set up nav bar
// ---------------------------------------------------------------------------

    $("#logo").on('click', function(){$(".content").moveTo(1);});
    $(".arrow").on('click', function(){
        $(".content").moveDown();
    }); 
    $("#nav_home").on('click ', function(){$(".content").moveTo(1); });
    $("#nav_work").on('click ', function(){$(".content").moveTo(2);});
    $("#nav_about").on('click ', function(){    $(".content").moveTo(3);    });
    $("#nav_contact").on('click ', function(){$(".content").moveTo(4);});

});

我明明哪里弄错了，可是我就是找不到...

Answer 1

我会尝试从点击的元素中获取部分索引，并确保索引始终正确:

$('nav li a').click(function(e) {
    var sectionIndex = $(this).data("target");
    console.log(sectionIndex); // print to check
    $('.content').moveTo(sectionIndex);
});