javascript - 滚动内容应该被隐藏

Question

问题是我想修剪在内容 A 中滚动的内容 B，当它再次向下滚动时，它应该重新出现。

所以它应该是不可见的区域，它被推到内容 A 中。我怀疑我在这里需要 javascript 或者这只是 css 的同义词？

body {
  background-image: url('https://placeimg.com/1000/1000/nature/grayscale');
  background-repeat: no-repeat;
  background-attachment: fixed;  
}

div { padding:10px; }

.fixed {
  position: fixed;
  top: 100px;
  left: 50px;
  border: 1px solid red;
  height:100px;
  width:400px;
  z-index: 10;
}

.content {
  background:#fff;
  width:400px;
  height:1200px;
  margin-top: 220px;
  margin-left: 50px;
}

<!-- 
  Bootstrap docs: https://getbootstrap.com/docs
-->

<div class="fixed">
  Content A
</div>

<div class="content">  
  Content B
</div>

非常感谢您的帮助！Rufnex

标签： javascriptcsshtmltwitter-bootstrap-3