【问题标题】:Jquery Scrollspy needs refresh functionJquery Scrollspy 需要刷新功能
【发布时间】:2013-09-25 18:05:15
【问题描述】:

我正在使用 Scrollspy 的 Jquery 独立实现。 我在这里有一个关于我的问题的 jsfiddle 示例:http://jsfiddle.net/2acyu/66/

当页面向下滚动浏览 3 个部分时,顶部导航链接会突出显示。

工作正常!

我的问题是我想要一些可以切换的隐藏元素。当显示一些额外的内容并且其中一个部分被展开时,它会抛出 scrollspy。尝试展开隐藏的文本,然后向下滚动。由于容器 div 的偏移值已更改,因此文本 2 的链接在此部分到达页面顶部之前突出显示。

scrollSpy 的 Bootstrap 版本有一个“刷新”方法,可以在添加/更改 DOM 中的元素时调用该方法来解决这种情况。但是,我使用的独立 JQuery 版本的 Scrollspy 没有。

另一个网站上的某人建议使用:

$(window).unbind("scroll");

然后重新创建小部件。

但我不确定如何实施此修复。

任何帮助表示赞赏。

【问题讨论】:

    标签: jquery refresh scrollspy


    【解决方案1】:

    我有一个固定大小的可滚动 div,我希望里面的内容随着用户向下滚动而动态增长。解决问题的关键是查看 scrollspy 源代码并确定最小/最大设置可以是函数,而不仅仅是静态值。因此,我将最小/最大设置设置为根据增长内容的当前大小返回值的函数。这样,当用户滚动时,内容会增长,并且 scrollspy 最小/最大设置会适当调整。

    $('.locked-size-container').scrollspy({
      min: function () { 
          // Adjust the 'enter' start position according to the container size
          return ($('.dynamic-size-container').height() / 3);
      },
      max: function () {
        // Adjust the 'enter' end position according to the container size
          return $('.dynamic-size-container').height();
      },
      container: $('.locked-size-container')[0],
      onEnter: function() {          
          console.log('loading new content...');
          ...
      }
    });
    

    【讨论】:

    • 我试过了,但当前版本的 scrollspy (github.com/sxalexander/jquery-scrollspy) 不允许 min/max 接受函数。你改变了你的这样做吗?
    • 查看line 45 看起来您仍然可以使用函数来获取最小值/最大值。它会从选项中提取它,见第 40/41 行,所以我上面的代码应该仍然可以工作,尽管我还没有尝试过。最小/最大函数应该在每个滚动事件上得到评估。
    • 我的错,我运行的是过时版本的 scrollspy。谢谢。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-06-28
    • 1970-01-01
    • 2021-12-21
    • 1970-01-01
    • 2012-02-02
    相关资源
    最近更新 更多