Question

以下JavaScript似乎运行得很好，直到我发现div的高度（id =＆＃34;固定＆＃34;）对于所有页面都不一样。

<script>
  window.addEventListener("scroll", function() {
    if (window.scrollY >= 450) {
      document.getElementById('fixed').style.position = 'relative';
    }
    if (window.scrollY <= 450) {
      document.getElementById('fixed').style.position = 'fixed';
    }
  });
</script>

出于这个原因，我想调整它的方式，一旦div滚动到id =＆＃34的下一个div，div的位置就会改变; next-to-fixed＆＃ 34 ;.

我看到另一篇为此实现jQuery的帖子，但我只想使用简单的JavaScript，所以如果有人能用一种方法来说明这一点，那就太好了。

试验：

  <script>
  window.addEventListener("scroll",function() {
  var elm1 = document.getElementById('product-essential');
  if(window.scrollY >= elm1.clientHeight) {
  document.getElementById('fixed').style.position = 'relative';
  }
  if(window.scrollY <= elm1.clientHeight) {
  document.getElementById('fixed').style.position = 'fixed';
  }
  }
  );
  </script>

Answer 1

您可以通过以下方式阅读height的{{1}}：

div

从这里开始使用var clientHeight = document.getElementById('myDiv').clientHeight;。

滚动到下一个div时改变位置？

1 个答案: