Question

我在页面顶部有一个按钮，我想编码它以继续下一个锚点而不管它是什么。实际上我会想要做下一个/上一个按钮来转到下一个和前一个锚点。此按钮位于静态框架上，因此它应该理想地滚动页面的其余部分。

任何建议都会很棒。我再也不知道锚是什么，这更像是使用通用按钮的章节导航。

好像在dom中找到下一个锚点对象并去那里应该是一个可行的事情，但我不是jquery或javascript中的高手来做那件事。

Answer 1

var index = -1;

$('.next').click(function() {
   index++;
   $(window).scrollTop($('a').eq(index).position().top);

});
$('.previous').click(function() {
   index--;
   if(index < 0) { index = 0;}

   $(window).scrollTop($('a').eq(index).position().top);
});

Answer 2

一个很好的解决方案是使用类设置'当前'锚点（可能是使用class ='current'在页面上硬编码第一个锚点），然后使用jquery通过dom并选择下一个或者以前的锚。假设你有“下一个”和“前一个”按钮，你可以这样做：

<script type="text/javascript">

  $('.next').click(function(e){
    e.preventDefault();
    var current_anchor = $('a.current');
    var next_anchor = current.next('a');
    $('body').animate({scrollTop:next_anchor.offset().top});
  })

  $('.previous').click(function(e){
    e.preventDefault();
    var current_anchor = $('a.current');
    var previous_anchor = current.prev('a');
    $('body').animate({scrollTop:previous_anchor.offset().top});
  })

</script>

如何在不知道锚名称的情况下将链接转到页面上的下一个锚点？

2 个答案: