模拟`位置：固定；`使用javascript，但不会出现跳跃、滞后或；hickups“；

我试图模仿

位置：固定使用javascript，原因是元素必须位于可滚动div（overflow-scroll-y）内，并且
位置：固定仅与窗口滚动相关，而不是元素滚动，尽管通常在这种情况下，我可以使用
位置：绝对来修复它一切都会正常工作，但是scollable div/container元素需要具有
透视图：1px制动
位置：绝对调整，回到js仿真

现在它可以用javascript工作了，但是问题中的元素经常会落后于滚动，产生一种“神经质”的感觉（在Firefox上尤其糟糕），也就是说它固定在元素的顶部，如果用户滚动，它应该总是恰好在顶部，但实际上有时会有点（或分配）过高或过低（取决于滚动方向），然后再次捕捉到位，这种捕捉或跳跃效果是不可取的，并且在可以使用
position:fixed或
位置：绝对

我已经提出了一个建议，如果你没有注意到浏览器中的不良影响，你可以尝试取消注释
increaseLag
函数，在我的电脑上，延迟在Firefox上清晰可见，但在Chrome上则不明显，除非我启用了increaseLag函数（我正在运行Ubuntu）

如何解决这个问题？是否有我遗漏的纯css解决方案或替代js路线

我当前的buggy解决方案在容器元素上使用了一个scroll事件，它相对于更新的滚动位置更新“fixed”元素的
top
css属性

$("#container_element").scroll(function() {
    //increaseLag(this);
    var scrollTop = $(this).scrollTop();
    $(".fixed_emulation").css("top", scrollTop+"px");
});




:) 
文本文本。文本文本。文本

文本文本。文本文本。文本

文本文本。文本文本。文本

...

#container_element {
  width: 100%;
  height: 100%;
  overflow-y: scroll;
  perspective: 1px;
}

.fixed_emulation {
  background-color: #000;
  color: #FFF;
  position: absolute;
  top: 0;
  width: 100%;
}

<div id="container_element">
  <div class="fixed_emulation"> :) </div>
  <p>Text text text. Text text. Text.</p>
  <p>Text text text. Text text. Text.</p>
  <p>Text text text. Text text. Text.</p>
  ...
</div>