2

我想执行以下脚本

$('html, body').animate({
    scrollTop: $('#deckblatt').offset().top
}, 1)

Deckblatt 是我页面上的第一个 content-div。

Chrome 不会这样做，但 FF 会。

令人困惑的部分是我在第二页上运行了相同的方法，这在 Chrome 和 FF 上都可以正常工作。

我错过了什么或者可能有更好的方法来做我想要实现的目标，防止浏览器在之前向下滚动时自动跳转到页面的一部分？

先感谢您。

编辑：

这是第一个项目的完整代码，它运行不正确

斯普滕韦尔斯

这是第二个的代码，效果很好

#2

4

1 回答 1

0

这不是 Chrome 错误。您的原始代码包含一些奇怪的东西。

  • 您没有任何具有scroll-top类的元素，应该在向下滚动时显示，并且用户可以单击以滚动到顶部。
  • 您没有任何具有top或bottomid 的元素，如另一个元素。
  • 您从其他工作示例中的 JSFiddle 代码中遗漏了一些需要的 CSS 代码。

  • 但是最重​​要的错误之一是：target变量在 JavaScript 代码中未定义，并且您检查它与“#top”字符串的相等性。这会导致 ReferenceError 异常。我想你想检查点击事件的目标元素的 id 是否等于"#top"字符串。为此，您应该event在事件处理程序中声明例如参数，并使用event.target.id. 所以代替这个：

    $('.scroll').click(function(){

    $('html, body').animate({
        scrollTop: $(this.id).offset().top
    }, 500);

    setTimeout("$('.scroll-top').fadeIn();",510 );

    if (target == "#top"){$('.scroll-top').hide() ;}

});

    您应该使用以下代码：

    $('.scroll').click(function(event) { // declaring event variable as an argument
    $('html, body').animate({
        scrollTop: $(this.id).offset().top
    }, 500);

    // inspecting the id of the click event's target element
    if (event.target.id == "#top") {
      $('.scroll-top').hide();
    } 
    else {
      setTimeout(function () {
        $('.scroll-top').fadeIn();
      }, 510);
    }

});

我修改了你的原始代码，取消了很多不需要的东西，但还有很多：

http://jsfiddle.net/uKcQG/3/

它仍然有点问题，但现在滚动似乎可以正常工作。

但正如我在评论中建议的那样，您绝对应该使用 Ariel Flesler 的jQuery scrollTo 插件来完成此任务：http ://demos.flesler.com/jquery/scrollTo/

于 2013-01-06T16:51:12.643 回答