Question

我正在做一个长长的一页。是的，我知道，我们讨厌一个人。至少我保证不会实施任何视差效果，我保证：）

我有多个部分可以打开/关闭。这部分工作正常。

问题：这些部分变得很长，当它们被关闭/折叠时，用户发现自己处于单页面中间的某个位置。

因此，当折叠一个部分时，我希望它折叠并平滑滚动回到顶部/折叠部分的开头。

这是我的剧本：

// Section-Collapse
    //---------------------------------------------------------
    $("section a.read-more").click(function() {
        if($(this).parents("section").hasClass("expanded")) {

            var scrollAnchor = $(this).attr("data-scroll"),
            scrollPoint = $(".anchor[data-anchor='" + scrollAnchor + "']").offset().top - 0;

            $("body,html").animate({
                scrollTop: scrollPoint
            }, 1500, function() {

                // close/collapse section
                $(this).parents("section").addClass("close");
                $("section.expanded.close div.expandable-content").slideUp();
                $(this).parents("section").removeClass("expanded").removeClass("close");
                alert("this test-message is being displayed");

            });


        } else {

            // open section
                $(this).parents("section").addClass("expanded");
                $("section.expanded div.expandable-content").slideDown();


        }
    });

问题：除了警报消息之外，这个部分没有被执行。虽然它试图多次打开对话框窗口，但Firefox让我阻止这种行为。

// einklappen
                    $(this).parents("section").addClass("close");
                    $("section.expanded.close div.expandable-content").slideUp();
                    $(this).parents("section").removeClass("expanded").removeClass("close");
                    alert("this test-message is being displayed");

它滚动回到顶部，到锚点，但该部分不会崩溃......

为什么它不会崩溃的任何想法？

此致米兰

--------------------------- UPDATE

所以，这是变量范围的问题＆＃34;这＆＃34;。

这里的代码似乎工作正常：

// Section-Collapse
    //---------------------------------------------------------
    $("section a.read-more").click(function() {
        if($(this).parents("section").hasClass("expanded")) {

            var scrollAnchor = $(this).attr("data-scroll"),
            scrollPoint = $(".anchor[data-anchor='" + scrollAnchor + "']").offset().top - 0;

            var global_this = $(this);

            $("body,html").animate({
                scrollTop: scrollPoint
            }, 1500, function() {

                // einklappen
                global_this.parents("section").addClass("close");
                $("section.expanded.close div.expandable-content").slideUp();
                global_this.parents("section").removeClass("expanded").removeClass("close");
                alert("this test-message is being displayed");
            });

            // return false;

        } else {

            // ausklappen
                $(this).parents("section").addClass("expanded");
                $("section.expanded div.expandable-content").slideDown();


        }
    });

困扰我的是：为什么这个脚本试图打开多个警报对话框？

折叠部分并滚动回顶部

0 个答案: