我正在做一个长长的一页。是的,我知道,我们讨厌一个人。至少我保证不会实施任何视差效果,我保证:)
我有多个部分可以打开/关闭。这部分工作正常。
问题:这些部分变得很长,当它们被关闭/折叠时,用户发现自己处于单页面中间的某个位置。
因此,当折叠一个部分时,我希望它折叠并平滑滚动回到顶部/折叠部分的开头。
这是我的剧本:
// 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
所以,这是变量范围的问题"这"。
这里的代码似乎工作正常:
// 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();
}
});
困扰我的是:为什么这个脚本试图打开多个警报对话框?