E
E
Evgeny Danilov2015-09-22 20:49:06
JavaScript
Evgeny Danilov, 2015-09-22 20:49:06

How to make the sticky window stop when scrolled to the footer?

I wrote my code to create a sticky block when scrolling the page, because for some reason the modules do not work as I need, everything works with a bang, only when we scroll to the very bottom of the site - the blocks run into the footer and do not stop, I tried some things so that they rise up (in the code you can see) when we scrolled down, but when you increase the zoom out of the site, this padding value does not work and as a result the block still goes beyond the footer and the white background even appears further.
How can I solve this problem, what needs to be added? Maybe I'm not correctly determining whether we scrolled to the basement or not?

$(window).load(function() {
// define leed block offset top at window loaded

var leedoffset = $('.leed_blocks').offset().top;

// check if blocks are in DOM //
if ($('.leed_blocks').length > 0) {
  
 		 if ($(window).scrollTop() >= leedoffset) {
 		 	$('.leed_blocks').addClass('absolute');
   		 $('.leed_blocks').css('top', $(window).scrollTop() + 40)
 		 } else {
   		 $('.leed_blocks').removeClass('absolute');
  		}
  		// define footer offset and check for disable overflow //
  		var bottomLeeds = $('.leed_blocks').position().top+$('.leed_blocks').outerHeight(true)
  		if (bottomLeeds >= $('.bottom').offset().top) {
  			$('.leed_blocks').css('top', parseInt($('.leed_blocks').css('top')) - parseInt($('footer').height()) );
  		}
} 

  // window scroll function 
  $(window).scroll(function() {

  // 	 leed sticky
 	if ($('.leed_blocks').length > 0) {
  		
 		 if ($(window).scrollTop() > leedoffset && $(window).scrollTop) {
 		 	$('.leed_blocks').addClass('absolute');
   		 $('.leed_blocks').css('top', $(window).scrollTop() + 40)
 		 } else {
   		 $('.leed_blocks').removeClass('absolute');
  		}
  		
  		var bottomLeeds = $('.leed_blocks').position().top+$('.leed_blocks').outerHeight(true)
  		if (bottomLeeds >= $('footer').offset().top) {
  			//$('.leed_blocks').css('top', parseInt($('.leed_blocks').css('top')) - parseInt($('footer').height()) );
  			$('.leed_blocks').css('margin-top','margin-top: -423px');
  		} else {
  			$('.leed_blocks').css('margin-top','margin-top: 0px');
  		}

  	} 

  })
  // resize window function
  $(window).resize(function() {

    var bottomLeeds = $('.leed_blocks').position().top+$('.leed_blocks').outerHeight(true)
  		if (bottomLeeds >= $('footer').offset().top) {
  			$('.leed_blocks').css('margin-top','-240px');
  		} else {
  			$('.leed_blocks').css('margin-top','0px');
  		}
  })

Answer the question

In order to leave comments, you need to log in

1 answer(s)
I
Igor, 2015-09-23
@bybelov

Sticky

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question