jQuery scrollしたら発火

html

<header></header>
<div class="content"></div>
<footer></footer>
<div id="fixed"></div>

要素が消えたら発火

javascript

※javascriptは必ずhtmlのあとに記述

topHideVal = $("header").height(); // ターゲットの高さ取得
$(window).on("scroll", function () {
   if ($(window).scrollTop() < topHideVal) {
      $("#fixed").removeClass("show");
   } else {
      $("#fixed").addClass("show");
   }
});

要素が見えたら発火

javascript

$(window).scroll(function(){
var top = $("footer").offset().top; // ターゲットの位置取得
var position = top - $(window).height(); // 消化させたい位置
   if($(window).scrollTop() > position){ 
      $('#fixed').removeClass('show');
   }else{
      $('#fixed').addClass('show');
   }
});