javascript - 在子 div 中滚动(固定)应该滚动父 div

Question

我有一个父子 div。子 div 绝对位于顶部并且可以滚动。我的要求是当我在子 div 中滚动时滚动父 div，并且滚动应该相同，即如果我在子 div 中滚动 100px，那么外部 div 也应该滚动 100px。

Jsfiddle

HTML

<div class="outer">
    <div class="inner">
        <p>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
            Curabitur mollis gravida metus, ac lacinia quam lobortis vel. Cras interdum purus
            aliquam, porttitor metus nec, ornare quam. Morbi eget lobortis elit
            ...
            ...
        </p>
    </div>
</div>

CSS

.outer{
    height:1600px;
    width:100%;
    background:#ddd;
}

.inner{
    position:absolute;
    height:200px;
    width:400px;
    background:red;
    margin:auto;
    top:40px;
    right:0px;
    left:0px;
    overflow:scroll;
}

Answer 1

监听 child 的 scroll 事件。在事件处理函数中，将父级的滚动顶部设置为与子级的相同。

类似下面的内容:

$('#child').on('scroll', function(){
    var sTop = $(this).scrollTop();
    $('#parent').scrollTop(sTop);
});

JSFiddle