我想在某些时候滚动div绿色滚动红色div 可能是通过jQuery或纯javascript ????
<div class="parentDiv">
<p>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
<p>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
</p>
<div class="childDiv">
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
v
this should scroll only form outside and inside<br>
</div>
</div>
答案 0 :(得分:0)
您希望监控正在滚动的元素的scroll
事件,然后您可以获取scrollTop
值并将其应用于要与其一起滚动的div。
以下是如何在jquery中执行此操作。
$('.childDiv').on('scroll',function() {
$('.parentDiv').scrollTop($(this).scrollTop());
})
.parentDiv
{
background-color: red;
height: 400px;
overflow: auto;
position: relative;
}
.parentDiv::-webkit-scrollbar{
display: none;
}
.childDiv
{
background-color: green;
height: 100px;
width: 300px;
overflow: scroll;
position: fixed;
bottom: 0;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="parentDiv">
<p>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
<p>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
<br>nothing to see here <br>
</p>
<div class="childDiv">
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
this should scroll only form outside and inside<br>
v
this should scroll only form outside and inside<br>
</div>
</div>