Question

这让我有点疯狂，因为我无法让它发挥作用:(！

我有jQuery选项卡设置如下（所有工作）：

    $(".tabs_area" ).tabs({
        fx: { duration: 'slow', opacity: 'toggle' }
    });

然后我有一个滚动到锚点焦点机制（再次在函数本身方面工作正常）：

    $('.tabs_area li a').bind('click',function(event){
        var $anchor = $(this);

        $('html, body').stop().animate({
          scrollTop: $($anchor.attr('href')).offset().top
        }, 500,'easeInOutExpo');

        event.preventDefault();
    });

我的问题是，遗憾的是他们不会同时工作。当我单击选项卡时，它会正确显示相应的选项卡内容但是它不会将您滚动到此内容的开头。您必须再次单击该选项卡，然后滚动到内容，这是不好的。

可悲的是我需要的原因是我在移动网站上使用它，当你点击标签时，虽然它实际上确实改变了内容，但它在标签菜单下方，因此在屏幕的可见区域下方，因此我希望它交换内容，然后向下滚动到这个，这样你就可以看到它，当然只需点击一下。

所以我认为我需要在标签设置代码中结合滚动功能...不知何故......作为回调或其他东西......但我只是一直在打破它:( !!

任何帮助都会非常感激。

提前致谢， TJ

Answer 1

为什么不对jQuery标签使用 show 选项？似乎做你想做的事。

检查solution

  $(".tabs_area" ).tabs({
        show: function(e,ui){
          $('html, body').stop().animate({
          scrollTop: $(ui.tab.getAttribute('href')).offset().top
        }, 500,'easeInOutExpo');
        }
  });

jQuery选项卡+同时滚动到内容

1 个答案: