jQuery在滚动上隐藏不相关的div

Question

这个scroll function是为相关的元素设置的，但我想在.to-hide中滚动时在不相关的.wrapper div上运行该函数。

var senseSpeed = 5;
var previousScroll = 0;
$(window).scroll(function(event) {
  var scroller = $(".wrapper").scrollTop();
  if (scroller - senseSpeed > previousScroll) {
    $(".to-hide")
      .filter(":not(:animated)")
      .slideUp();
  } else if (scroller + senseSpeed < previousScroll) {
    $(".to-hide")
      .filter(":not(:animated)")
      .slideDown();
  }
  previousScroll = scroller;
});

.container {
  display: flex;
  flex-direction: column;
  border: 2px solid blue;
  margin: 5%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.wrapper {
  border: 2px solid;
  position: relative;
  flex: 1;
  overflow: scroll
}

.item {
  border: 3px solid green;
  height: 1080px
}

.to-hide {
  border: 2px solid;
  background-color: red;
  height: 66px;
  width: 66px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <div class="to-hide"></div>
  <div class="wrapper">
    <div class="item"></div>
  </div>
</div>