How to make Div disappear when scrolling (this) close to bottom

Question

Basically,I want a div (sidebar) to slide off to the left when the user scrolls to, for example, 50px away from the bottom of the page, the closest thing I found is this piece of code

<script>
    $(window).bind('scroll', function() {
     if ($(window).scrollTop() > 100) {
         $('#myDivId').hide();
     }
     else {
         $('#myDivId').show();
     }
});
    </script>

I tried modifying it but to no avail.I already have a transition attribute so all I need is basically to have the div's position become -100px to the left.

and I know I probably shouldn't be asking two questions but why does my footer not extend to the full width of the page I know it has to do with the sidebar but in what way??

Answer 1

You can use the code from here: Check if a user has scrolled to the bottom

The following code hides a div if the page is scrolled 100px from the bottom.

$(window).scroll(function() {
  if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
    $('#myDivId').hide();
  }
  else {
    $('#myDivId').show();
  }
});