jQuery scrollしたら発火

html

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

要素が消えたら発火

javascript

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

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

要素が見えたら発火

javascript

$(window).scroll(function(){
if($(this).scrollTop() + $(window).height() > $('footer').offset().top){
      $('#fixed').removeClass('show');
   }else{
      $('#fixed').addClass('show');
   }
});