航点偏移不起作用（函数立即运行）？

Question

我在我的网站上使用waypoints.js。现在我想尝试一下。

我的HTML代码：

<section id="home">
    <p>content</p>
</section>

<section id="info">
    <p>content</p>
</section>

我的CSS代码：

#home {
    width: 100vw;
    height: 100vh;
    background-color: red;
}

#info {
    width: 100vw;
    height: 100vh;
    background-color: yellow;
    top: 100vh;
    left: 100vw;
}

我在#info上使用100vh的顶部和100vw的左边的原因是因为我使用了另一个名为scrollpath（http://joelb.me/scrollpath/）的jQuery插件。 我从家对角线下方画一条滚动路径到信息。

我的jQuery代码：

jQuery(window).load(function () {
    //Animate from top
    $('#home').waypoint({
      handler: function() {
        alert('message')
      },
      offset: '50%'
    })
});

问题是，当我加载网站时，会立即显示警报，但我希望它显示偏移量为50％。

出了什么问题？