当用户滚动浏览页面后刷新页面时,我的航点功能有未定义的行为

问题描述

我有一个导航栏,当用户向下滚动经过它时,我将其位置设置为固定,而当用户向上滚动经过该点时,使用以下航路点将其设置为固定:

var $navbar = $('.navbar-default');

$navbar.waypoint(function(){
    if ($('#navigation-bar').hasClass('navbar')){
        $('#navigation-bar').toggleClass('navbar-fixed');
    } else{
        ($('#navigation-bar').toggleClass('navbar'));
    }
},{ offset: '28%' });

这可确保导航栏仅在特定点之前停留在用户屏幕上。这在大多数情况下都是按预期方式工作的,但是问题是,如果用户向下滚动到该航点,然后刷新页面,导航栏将跳回到其原始位置,如果您向后滚动,导航栏将导致未定义的行为。 / p>

有没有一种方法可以确保用户刷新时屏幕上的所有内容都保留在相同的位置?

解决方法

页面加载时,您可以使用window.scrollTo函数

//scrollTo(x,y)
window.scrollTo(0,0);

//the rest of your code...

每次加载页面时,它将滚动到页面的左上角。

编辑:

this问题的答案也可能有用:

* {
  overflow-anchor: none;
}

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...