使 jQuery 航点偏移相对

Question

您知道刷新网页时通常如何保留滚动位置吗？

嗯，jQuery Waypoints 偏移功能似乎将此页面位置用作 0 而不是页面的实际顶部。

例如，假设航点偏移量为 50，假设您当前在页面刷新时的滚动位置为 1000。刷新后的页面会自动跳回1000，直到滚动位置达到1050这个航点才会激活。

是否可以保持航点相对于页面顶部？因此，即使页面自动更新 1000 的滚动位置，偏移量为 50 的航点也将处于活动状态。

$('.thing').waypoint(function(direction) {
    // do stuff
}, { offset: 50 })

更详细的代码：

(function($, window, document) {

    $(function() {

        var $popularArticles = $('.popular').find('article'),
        $latestArticles = $('.latest').find('article');

        var $latestPost = $latestArticles.filter(':first');
        var $latestPostDate = $latestPost.find('time').text();

        $latestPost.before('<h2>' + $latestPostDate + '</h2>');
        $popularArticles.filter(':first').before('<h2>Popular Now</h2>');

        // updates postdate in latest h2

        $latestArticles.waypoint(function(direction) {
            var $postDate = $(this).find('time').text();
            if (direction === 'down') {
                $latestH2.text($postDate);
            }
        }, { offset: 102 }).waypoint(function(direction) {
            var $postDate = $(this).find('time').text();
            if (direction === 'up') {
                $latestH2.text($postDate);
            }
        }, { offset: function() {
            return - $(this).height() / 2 + 50;
            }
        });

        // h2 waypoints

        var $latestH2 = $('.latest').filter(':first').find('h2'),
            $popularH2 = $('.popular').filter(':first').find('h2');

        $popularH2.add($latestH2).waypoint('sticky', { offset: 50 });

    });

}(window.jQuery, window, document));

Answer 1

我认为浏览器直到页面加载后才会跳转到滚动位置，因此请尝试在页面加载之前而不是在加载时运行您的航点代码。