jQuery滚动到下一个/上一个部分

关于这一点有很多问题，但我看到的解决方案不适合我的使用

我需要一个jQuery函数来让页面滚动到我网站的下一个部分-但是我的下一个/上一个按钮被全局定位在这些部分的上方-因此使用像go to next parent这样的方法是行不通的，也没有“查找下一个”部分，因为层次结构嵌套不正确，因为箭头按钮位于部分本身的外部

代码必须在不考虑节数的情况下工作，并且不需要硬编码节类/ID

有什么想法吗

代码示例如下：

<div class="arrows">
<a href="#" class="arrow-up prev-section"></a>
<a href="#" class="arrow-down next-section"></a>
</div>

<section class="panelSection">
... section content here ...
</section>

<section class="panelSection">
... 2nd section content here ...
</section>

试试这个：

var sections = $('.panelSection');
console.log(sections);
var i =0;
var scrolto = 0;

function next(){

    if(i == 0){
        $('.prev-section').show();
    }
    if(i < sections.length -1){
        i++;
        if(i == sections.length -1){
             $('.next-section').hide();   
        }
         $('html, body').animate({
            scrollTop: sections[i].offsetTop
        }, 2000);
    }else{
        alert('end reached');
    }
}
function prev(){
    if(i == sections.length -1){
        $('.next-section').show();
    }
    if(i > 0){
        i--;
        if(i == 0){
            $('.prev-section').hide();
        }
         $('html, body').animate({
            scrollTop: sections[i].offsetTop
        }, 2000);
    }    
}
$('html').keydown(function(e){
    if(e.which == '38'){
        prev();    
    }
   if(e.which == '40'){
        next();    
    }
});
$('.next-section').click(function(e){
   e.preventDefault();
   next();
});

$('.prev-section').click(function(e){
   e.preventDefault();
   prev();
});       

您将节存储在一个数组中，并在单击时循环该数组，然后滚动到偏移顶部。使小提琴，使其隐藏按钮，并检查最小最大数量的部分，还包括向上向下键箭头支持

---

fiddle:

使用$.first如何找到第一节，滚动到那里，然后将DOM对象保存在一个变量中，这样您就可以将其与$.next一起使用，转到下一节。第一个快速的主意。谢谢阿德里安-听起来是个好主意。。。但不确定如何保存到DOM。。。有代码建议吗？检查答案，我不能在评论中发布代码。再说一次，它没有在JSFIDLE中测试过，所以请测试它并告诉我它是否有效或者至少有帮助。谢谢-不，它现在不起作用，我会看看我是否能破解它…我很抱歉。如果我今天有时间的话，我会设法解决它：谢谢-这看起来很有希望是的。。。问题是，即使在部分的顶部和底部，您也可以继续启动函数。。。您是否可以调整它以防止在查看第一节时单击上一节，以及在查看最后一节时防止单击下一节？否则很容易破坏这个解决方案哦，是的，我看到了一个bug，编辑了我的小提琴看看@dubbstanks。效果非常好。非常感谢。最后一件事。。。我们可以添加键盘上下控制来更改分区吗？