leafo/sticky-kit

is_stuck class is not removed when scrolling past the parent bottom

Opened this issue · 3 comments

When I go past to top part of the parent the 'is_stuck' class is toggled correctly, but when I scroll passed the bottom part of the parent, the 'is_stuck' class is not removed, although the element has its css styles changed (from this 'position: fixed; top: 0px; width: 0px;' to this 'position: absolute; top: auto; width: 0px; bottom: 0px;').

danyj commented

Same here

t00ki commented

The same for me

You can easily do it using EVENTS (documentation):

.on("sticky_kit:bottom", function(e) {
   $(this).addClass('at_bottom').removeClass('is_stuck');
});

and

.on("sticky_kit:unbottom", function(e) {
   $(this).removeClass('at_bottom').addClass('is_stuck');
});

= wrap it up:

$("#selector").stick_in_parent().on("sticky_kit:bottom", function(e) {
   $(this).addClass("at_bottom").removeClass("is_stuck");
}).on("sticky_kit:unbottom", function(e) {
   $(this).removeClass("at_bottom").addClass("is_stuck");
});

This example adds at_bottom class and remove is_stuck class when element reach bottom