Javascript 滚动以显示和显示元素

我试图在滚动时显示/显示元素。到目前为止我没有成功，但我希望你能帮助我

由于.heigh（）和.scrollTop（）方法，我现在使用jQuery，但我更愿意使用纯JS

到目前为止我的代码

HTML

JS:

---

这里

检查这个很棒的插件：或者两者都不能工作…

<div class="container">
  <div class="filler"></div>
  <div class="filler"></div>
  <div class="filler"></div>
  <div class="filler"></div>
</div>
<div class="toShow"></div>

.container
  width: 100%
  height: 100%
  overflow: auto
  border: 3px solid crimson
  box-sizing: border-box

.filler
  width: 100%
  height: 200px
  border: 2px solid green

.toShow
  width: 50%
  height: 100px
  background-color: navy
  display: none
  position: fixed
  top: 0
  left: 0

(function() {
  $(window).scroll(function() {
      var H = $(".container").scrollTop() / 2
      var contH = $(".container").height()
      if(H > contH ){
            $(".toShow").fadeIn()
            console.log("yes")
      }else{
            $(".toShow").fadeOut()
      }
  })
}.call(this))