如何保存滚动状态

时间:2013-07-23 21:27:27

标签: javascript jquery scroll

我想保存/确定滚动状态(当前位置),所以当用户回到上一个站点时,他可以从他离开的位置继续他的工作。

我可以将滚动位置连续保存到全局变量并在用户返回时读取它吗?

2 个答案:

答案 0 :(得分:3)

使用javascript,您可以找到滚动高度,然后将其设置为cookie。这不是一个好方法,但它是可能的。

找到滚动高度:

$(document).ready(function(){
    $(window).scroll(function(){
       var scrolled = $(this).scrollTop(); 
        console.log(scrolled);
    });
});

我建议使用jquery cookie插件将其设置为cookie或会话: http://archive.plugins.jquery.com/project/Cookie http://www.sitepoint.com/eat-those-cookies-with-jquery/

然后将变量添加到cookie:

$(document).ready(function(){
    $(window).scroll(function(){
        $.removeCookie("mySiteScrolled");
        var scrolled = $(this).scrollTop(); 
        $.cookie("mySiteScrolled", scrolled);
        console.log(scrolled);
    });
});

然后添加“检查滚动”声明

$(document).ready(function(){
    var scrolled = $.cookie("mySiteScrolled");
    if(scrolled){
        $(window).scrollTop(scrolled);
    }
    $(window).scroll(function(){
        $.removeCookie("mySiteScrolled");
        var scrolled = $(this).scrollTop(); 
        $.cookie("mySiteScrolled", scrolled);
        console.log(scrolled);
    });
});

答案 1 :(得分:0)

我可能会使用jQuery轻松确定滚动位置$(document).scrollTop();并使用本地存储来设置/获取位置。