jQuery UI Vertical Tabs 使页面滚动“粘住”

Question

我目前正在使用开箱即用的 jQuery UI Vertical Tabs sn-p，它如何影响整个页面滚动存在一个奇怪的问题。每次更改选项卡，然后尝试向上或向下滚动页面主页时，它最终都会“粘”在适当的位置一段时间，然后正常工作。你可以在这里看到效果：http://investors.realcrowd.com/tab-tester

不确定问题出在哪里，甚至不知道如何诊断...是否可以添加任何 sn-p 代码来解决此问题？感谢您的帮助！

Answer 1

不是 100% 确定这是否是解决方案，但在这一点上，我非常有信心。

检查您的源代码，您在代码的最开始就有一个触发器。更具体地说，它位于此处：

<script>
$('body').bind('touchmove', function(e){
  e.preventDefault();
});
</script>
<script>
$(function() {
  $('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});

</script>

在包含 jQuery 之后。

在这段代码中，您实际上有一个处理程序，该处理程序在调用非空锚时触发。 这个事件，经过几次检查后会调用这个：

$('html,body').animate({
              scrollTop: target.offset().top
            }, 1000);

这将执行一个 1 秒的动画（1000 毫秒），将视图滚动到所需目标的顶部偏移量。在这一秒内，如果你要滚动，它会迫使你被粘在目标偏移量的顶部，因此它会强制你不要滚动到他想滚动的其他地方。

要解决这个问题，您可以将 1000 设置为 1，或者只是删除动画，即使实际滚动到目标的偏移量是个好主意，因此只需将 1000 替换为 1（或 10 甚至 100）即可好的。

希望这会有所帮助。