相关疑难解决方法(0)

如何使用jQuery在页眉和页脚之间滚动时使侧边栏变粘(不滚动它们)?

我需要一个严格的jQuery解决方案来解决这个问题.这是因为我正在使用Wordpress,而我想制作粘贴的侧边栏小部件位于一个<aside>我无法达到全高度的元素内.

以同样的方式.scrollTop()检测我在页面下方的距离使侧边栏小部件变粘,我需要JS检测我从页面底部到目前为止通过分配新的固定位置来"取消"小部件.

我尝试过这个,.offset()但到目前为止我一直无法工作.

  function stopDiv() {
    var distance = $('.footer').offset().top - $('.widget').offset().top;
    if (distance < 10) {
      $('.widget').css({
        'top': 'auto',
        'bottom': '10px'
      });
    }
  }
Run Code Online (Sandbox Code Playgroud)

你可以在我的侧栏下方的片段中看到它应该滚动,但我希望侧边栏在距离页脚距离<10px时采用新的固定位置.

我希望侧边栏在页脚上方采用新的固定位置,直到用户向上滚动.

编辑: @Benvc下面建议的解决方案在片段中工作正常,但在我的wordpress网站上没有.以下是我得到的控制台错误:

scripts.js:18 Uncaught ReferenceError: s is not defined
    at HTMLDocument.<anonymous> (scripts.js:18)
    at i (jquery.js:2)
    at Object.fireWith [as resolveWith] (jquery.js:2)
    at Function.ready (jquery.js:2)
    at HTMLDocument.K (jquery.js:2)
    at HTMLDocument.s (VM11874 rocket-loader.min.js:1)
    at p (VM11874 rocket-loader.min.js:1)
    at t.simulateStateAfterDeferScriptsActivation (VM11874 rocket-loader.min.js:1)
    at Object.callback (VM11874 rocket-loader.min.js:1)
    at t.run (VM11874 rocket-loader.min.js:1)
Run Code Online (Sandbox Code Playgroud)

javascript css wordpress jquery scroll

7
推荐指数
1
解决办法
791
查看次数

标签 统计

css ×1

javascript ×1

jquery ×1

scroll ×1

wordpress ×1