Answer the question
In order to leave comments, you need to log in
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
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question