页面水平滚动不工作div jquery

Question

我在这里使用这个插件水平滚动。 http://manos.malihu.gr/horizontal-page-animation-to-id-with-jquery/

这是我用它创建的演示链接。 http://aijaz.co/hearing1/

我面临的问题是，当滚动链接正好位于.content下方时，我可以滚动页面。当我把链接放在几个div中时，页面不会滚动。例如：

<div> 
    <div> 
     <hr /> 
     <a href="#top">&larr; Back to start</a> <a href="#" rel="next">Next section &rarr;</a> 
    </div> 
</div> 

这是它正在使用的脚本。

<script> 
    (function($) { 
     $(window).load(function() { 

      /* Page Scroll to id fn call */ 
      $("#navigation-menu a,a[href='#top'],a[rel='m_PageScroll2id']").mPageScroll2id({ 
       layout: "horizontal", 
       highlightSelector: "#navigation-menu a" 
      }); 

      /* demo functions */ 
      $("a[rel='next']").click(function(e) { 
       e.preventDefault(); 
       var to = $(this).parent().parent("section").next().attr("id"); 
       $.mPageScroll2id("scrollTo", to); 
      }); 
     }); 
    })(jQuery); 
</script> 

请帮我一把。谢谢。

Answer 1

你错了我猜，使用相同的类为每个标签，并确保它会工作，通过插件文件。

Answer 2

尝试traversing向上通过点击的元素的祖先，而不是使用.parent()多次：

$("a[rel='next']").click(function(e){ 
    e.preventDefault(); 
    var to=$(this).closest("section").next().attr("id"); 
    $.mPageScroll2id("scrollTo",to); 
});