我想制作固定定位的侧面div,它应该在用户滚动到达第二节时才开始表现固定,它实际存在并且应该保持固定直到用户滚动到达页脚。代码也应该响应。固定div在响应(移动布局)中不可见。
.fixed-div {
position: fixed;
}
<div style="background:pink;height:50px;color:white;" class="header">
i am header
</div>
<div style="background:black;height:600px;color:white;" class="top">
top section
</div>
<div style="display:flex;">
<div style="width:40%;background:red;" class="fixed-div">
i am left fixed div
</div>
<div style="width:60%;background:yellow;margin-left:auto;">
<div style="height:70%;">i am right 1st div</div>
<div style="height:70%;">i am right 2nd div</div>
<div style="height:70%;">i am right 3rd div</div>
<div style="height:70%;">i am right 4th div</div>
</div>
</div>
<div style="background:black;height:500px;color:white;" class="header">
i am footer
</div>