1

我正在使用scrollify.js最新版本的页面滚动效果,updateHash并且sectionName设置为false.

我的问题是,发布页面刷新焦点在我离开的同一部分。例如,假设我在第 4 部分,当我按F5页面刷新并登陆相同的第 4 部分而不是登陆第 1 部分时。甚至Ctrl+F5在 Chrome 浏览器中也没有帮助。这是我的代码。

$('body').css('overflow', 'hidden');
$.scrollify({
  section: ".scroll-section",
  sectionName: false,
  interstitialSection: "",
  easing: "easeOutExpo",
  scrollSpeed: 1100,
  offset: 0,
  scrollbars: true,
  standardScrollElements: "",
  setHeights: true,
  overflowScroll: true,
  updateHash: false,
  touchScroll: true,
  before: function(index, section) {
    var className = '.' + $.scrollify.current().data('section');
    $('.sticky-left-nav').find('li').removeClass('active mb30');
    $('.sticky-left-nav').find(className).addClass('active mb30');

    if (index > 3) {
      $('body').removeAttr('style');
    } else {
      $('body').css('overflow', 'hidden');
    }
  },
  after: function() {},
  afterResize: function() {},
  afterRender: function() {}
});

任何帮助表示赞赏。提前致谢。

4

2 回答 2

1

它与插件无关。当页面offsetTop设置好后,浏览器重新加载后滚动到最后一个位置。你可以在这里看到它的直播

您可以通过在页面加载时将页面滚动回顶部来解决此问题。

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

现场演示在这里

我不确定我们为什么需要setTimeout,但这是唯一可行的方法。

于 2017-08-21T09:47:28.517 回答
0

我通过结合位置更改 onload 以及滚动到窗口顶部解决了这个问题。

    $(window).on('load', function() {
  location.href = 'http://localhost:3000/#1';
  setTimeout(function() {
      $(window).scrollTop(0);
      $.scrollify.update();
  });
});

您必须根据自己的方式调整 location.href 并将 updateHash 设置为 true 以便浏览器知道您希望它去加载哪个哈希

于 2018-08-14T19:32:54.150 回答