页面加载后如何执行jquery动画滚动？

Question

我在导轨4上有一个引导3导航栏，上面带有徽标。 准备好文档后，它将运行：

$(document).ready ->
  $("html,body").animate
    scrollTop: 270
  , "slow"

这样可以正确对齐浏览器中的顶部图像。

如果单击导航栏中的徽标，它将使用以下代码滚动到页面顶部：

  $("#home").click (e)->
    e.preventDefault()
    $("html,body").animate
      scrollTop: 270
    , "slow"

但是，如果我单击其他导航栏项（例如“关于我”），然后单击徽标，则它将加载主页，但不会滚动到正确的位置。

如何确保每次加载页面时都能可靠地进行页面滚动，以使照片始终始终对齐？

谢谢！

更新：托德（Todd）是完全正确的，将“ page：change”上的.ready更改为解决此问题的关键。 单击链接时，完成页面将滚动到默认位置或向下滚动链接位置。 谢谢！

$(document).on "page:change", (e)->
    if $("#intro").length
        e.preventDefault()
        $("html,body").animate
        scrollTop: 270
      , "slow"

        $("#home").click (e)->
            e.preventDefault()
            $("html,body").animate
                scrollTop: 270
            , "slow"


    $("#scroll-down-link").click (e)->
        e.preventDefault()
        $("html,body").animate
            scrollTop: 1300
        , "slow"

Answer 1

Turbo链接不会触发ready事件，因此您必须使用'page：change'事件。 详细信息在这里 。 之所以这样工作是因为Turbo链接会覆盖正常的页面加载过程。

做：

$(document).on 'page:change', ->

非咖啡版本

$(document).on('page:change', function() {


});