javascript - 页面重新加载时 float 导航超出边界

Question

我有一个随窗口滚动并停在页脚上方的导航，效果非常好。除非您在向下滚动到 nav 应该跟随您的位置后重新加载页面或使用后退按钮导航到该页面。然后它会显示在页脚上，直到您滚动为止。首次加载页面时，如何让 nav 将 top:###px; 样式附加到 nav？

这是现有的代码:

define(['jquery', 'bootstrap'], function ($) {
  function PageNavAffix(options) {
    this.$element = $('#page-nav');
    this.$container = $('#page-nav-container');
  }
  PageNavAffix.prototype.bindEvents = function () {
    $(window).on('resize', this.configureBounds.bind(this)) .trigger('resize');
    return this;
  };
  PageNavAffix.prototype.configureBounds = function () {
    var module = this;
    var vgapBase = 6;
    this.$element.affix({
      offset: {
        top: module.$container.offset().top + parseInt(module.$container.css('padding-top')) - vgapBase,
        bottom: function () {
                  var pageHeight = $('html').outerHeight();
                  var offset = module.$container.offset().top;
                  var containerOuterHeight = module.$container.outerHeight();
                  var containerPadding = parseInt(module.$container.css('padding-bottom'));
                  var containerHeight = containerOuterHeight - containerPadding;
                  this.bottom = pageHeight - offset - containerHeight;
                }
            }
        });
    };
    return PageNavAffix;
});

Answer 1

在沉思之后，我找到了一些解决方案/解决方法。我将其添加到 bindEvents 函数中:

$(window)
  .on('beforeunload', function() {
      $(window).scrollTop(0);
  });

或者我可以添加这个:

$(window)
  .on('load', function() {
      $(window).scrollTop($(window).scrollTop()-1);
  });