Footer hides floating nav - Any way to slide floating nav up once it reaches the footer?

Question

I\'m trying to add a floating navigation to the side bar. I have jquery floating the nav to the top after you begin scrolling. It works fine at the top, but once you reach the b

Answer 1

Is this like what you're looking for: http://jsfiddle.net/N5AC8/1/

$(document).ready(function() {
      var top = $('#floatingNav').offset().top - parseFloat($('#floatingNav').css('marginTop').replace(/auto/, 0));
      var maxTop = $(document.body).height() - $('footer').height() - $('#floatingNav').outerHeight();
      $(window).scroll(function(event) {
          var y = $(this).scrollTop();
          console.log(y, maxTop);
          $('#floatingNav').css({
              position: '',
              top: ''
          });
          if (y >= maxTop) {
              $('#floatingNav').css({
                  position: 'absolute',
                  top: maxTop
              });
          } else if (y >= top) {
              $('#floatingNav').addClass('fixed');
          } else {
              $('#floatingNav').removeClass('fixed');
          }
      });
  });

This is not really optimized, but should give you something to work from if it's what you're looking for.

Answer 2

Give the navigation a higher z-index than the footer. Something like z-index:99; will definitly do it.