javascript - 制作 div 滚动会导致它抖动

Question

我试图解决的问题可以在这里看到：http: //jsfiddle.net/AAyLj/14/

基本上，当我滚动爸爸 div 时，男孩 div 应该向上/向下移动。这工作正常，但男孩 div 有一点抖动。这是因为（我认为）js 的处理速度不够快。在功能强大的 Mac 上，这不会发生 - 但它会发生在 PC 上。

有没有办法用 js 或 css 克服这种抖动？谢谢。

更新：

我不能使用固定位置，因为如果我将男孩 div 保持为位置：固定，页面上还有其他元素（未在 jsfiddle 中显示）会扭曲外观。

Answer 1

正如 karthikr 所说，您可能应该使用 CSS position: fixed。如果这不是您想要的，您可以使用该animate功能。它给它一个很好的小延迟。

请参阅jsFiddle以了解我的意思。

Answer 2

让我们试试这个 css，不需要 js。http://jsfiddle.net/AAyLj/27/

.papa {
    min-height: 500px;
    height: 500px;
    background-color: yellow;
    position: relative;
    top: 200px;    
    overflow: scroll;
    width: 100%;
    padding-top:10px;
}
.boy {
    height: 200px;
    min-height: 200px;
    background-color: gray;
    position: fixed;
    margin-top: 200px;    
    width: 70%;
    float:left;
}

.girl {
    height: 800px;
    min-height: 800px;
    background-color: red;
    position: relative;
    width: 30%;
    float: right;
}
​