Question

我在父div中遇到了一些与子div粘连的问题。父div有两个子div。 child2高度超出了父div的高度。所以我添加了父div的滚动。现在问题是我想让孩子1 div变得粘稠，当我让孩子1变得粘稠时，这个div的宽度超出了父div。 child1应该进入父div并且能够水平滚动父div。

.parent {
  width:250px;
  height:250px;
  background-color:#CCCCCC;
  position:relative;
  overflow:scroll;
}

.child1 {
  width:500px;
  height:50px;
  background-color:#4285F4;
  position:fixed;

}
.child2 {
  height:500px;
  width: 600px;

}

<div class="parent">
   <div class="child1"></div>
    <div class="child2"></div>
</div>

任何帮助都将深表感谢。

更新确切的问题是，当我将child2的宽度设为500px时，我能够水平滚动。但是child1正在移出父div并且内容正在显示。

Answer 1

为什么不给你的孩子1一个适合父母的定义宽度，这样你仍然可以使用固定的定位？

请参阅DEMO

Answer 2

感谢您的支持。我通过添加以下Jquery代码解决了这个问题，并将child1设为 position：absolute

$(document).ready(function(){
  $(".parent").scroll(function(){
    console.log("scorled");
$(".child1").css("top", $(".parent").scrollTop() + "px");
 });
});

粘性子div相对于父div水平滚动

2 个答案: