jQuery scrollTop滚动问题

Question

我在滚动时遇到2个问题，我认为在一个帖子中问两个问题会更容易。

在我问之前，下面是我的jQuery代码存在问题。

$("a").click(function() {
    if(this.hash){
        $("#main").animate({
            scrollTop : $("h3[name="+this.hash.substr(1)+"]").position().top - 120
        },2000,"easeOutExpo");
    }
});

情况：我在页面上所做的基本上是我有一个带有几个列表的侧边菜单。 每个列表中的每个项目都链接到我的主要div部分或“内容”部分中的锚点。 单击列表项后，上面的代码运行，并且滚动到锚点之一。

问题1：当我单击列表之一中的项目时，它向下滚动到锚点，效果很好。 但是当再次单击同一项目时，主区域将滚动回到div的顶部。 我想解决此问题的方法是检查div的当前“滚动到”位置，然后，如果自第一次单击以来位置未更改，则不允许代码再次运行，但我无法使其正常工作。 有关如何解决此问题的任何建议？

问题2：再次如上所述，当我单击列表中的项目时，它会向下滚动到锚点。 然后，我希望能够单击另一个列表项，并将其滚动到该位置。 问题是，当我单击其他列表项时，它会滚动到主div中的某个随机位置，这些位置我什至还没有定位。 谁能解释我如何做到这一点，以便我可以在锚点之间滚动？

注意：请在您的解释上方添加问题1或问题2作为答复，以便我知道您所指的是哪一个。 谢谢

编辑：感谢Roko的帮助，我让它正常工作。 对于将来的观看者来说，这是一个正在运行的演示的小提琴： http : //jsfiddle.net/TsUcc/3/以下是最终的jquery代码如下所示

$("a").click(function( e ) {
    e.preventDefault();

    if(this.hash){

        var target = '#'+ this.hash.substr(1);
        var destination = $(target).offset().top - 10;

        $('#main').stop().animate({
            scrollTop : '+=' + destination
        }, 1000);
    }
});

Answer 1

现场演示

问题1：

您可能使用了诸如<a href="#goto">goto</a>并且没有阻止浏览器的默认行为，只需将事件传递给click处理程序即可，例如：

$("a").click(function( e ) {
     e.preventDefault();
     // .....
});

问题2

您使用的HTMLelement position仅仅是元素相对于其父元素位置的被动位置。 也就是说，即使元素位于页面底部，其位置也可以为30 。
解决该用途

offset().top

_{也值得一读： https ： //developer.mozilla.org/en-US/docs/Web/API/element.getBoundingClientRect}

问题3

H3元素不应具有name属性。
为此，请使用ID 。
为什么？
如果您的网站不错，并且页面底部有一些性感的东西，我可以通过在以下链接中引用您的网页和ID将链接发送给我的朋友：

example.com＃bottomLady

他会立即得到我的想法，而无需一直向下滚动页面。