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

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

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

Answer 2

我猜你做错了，每个标签都使用相同的类，并确保它可以正常工作，请查看插件文档。

页面的水平滚动在div jquery中不起作用

2 个答案: