在两列行中的可滚动DIV内锚定

<div class="container">
  <div class="left-column">
    <!-- 左侧内容 -->
  </div>
  <div class="right-column">
    <!-- 右侧内容 -->
  </div>
</div>

.container {
  display: flex;
}

.left-column {
  width: 30%; /* 左侧列宽度 */
  overflow-y: scroll; /* 垂直滚动条 */
}

.right-column {
  width: 70%; /* 右侧列宽度 */
}

window.addEventListener('scroll', function() {
  var leftColumn = document.querySelector('.left-column');
  var anchorElement = document.querySelector('.anchor-element');
  
  if (anchorElement.getBoundingClientRect().top < 0) {
    leftColumn.style.position = 'fixed';
    leftColumn.style.top = '0';
  } else {
    leftColumn.style.position = 'static';
  }
});