Sticky Element vanishing 1.0.4

[neotropic2023]

When scrolling and upon reaching the bottom of the page, the element being stickied just vanishes off of the screen. I thought it was the top: auto doing it, but when I removed that, it kept doing it.

Also, same issue in 1.0.2 and current. When in fullscreen, all works great. But when you shrink the screen down, as if using an iPad, the content not stickied falls below the sticky element and scrolls over it.

Playing with it more, when resizing (Responsive design using Gumby Framework) it randomly jumps back into place and scrolls fine. It is so random. At screen width 759, it gets funky. Width 760, its fine. 762 & 3, funky. 764 fine. Can see it popping around.

I know the responsive is fine. Does not do this without the sticky script running.

[leafo]

would it be possible to get an minimal html/css/js reproducing the problem, or at least as page I can look at that has the issue

[neotropic2023]

Yeah, come monday I will create a little page. About to leave for the weekend here.

[leafo]

No rush, thanks

[neotropic2023]

Ok, had to come in for a few hours.

http://www.websites4you.com/demo/test/1.0.4/ http://www.websites4you.com/demo/test/no-sticky/

Yeah, does it in this demo to. So scroll down a bit when the sticky take effect. Then resize the screen. You will see the non-sticky does not do that at all.

I know many people do not resize their screen much. But worried it may have that issue on a specific screen size.

Resolved my sidebar jumping off of screen.

CHANGED: return elm.css({ position: "fixed", bottom: padding_bottom, top: "auto" }).trigger("sticky_kit:bottom");

TO: return elm.css({ position: "absolute", bottom: padding_bottom, top: "auto" }).trigger("sticky_kit:bottom");

[xmojmr]

I have hit similar problem. My sticky element went to the bottomed = true state although it should be always sticked to the top. Never to the bottom. The core cause of this problem was that internal recalc() was not called automatically when neighboring elements resized. As a result sticky calculated positions based on incorrect metrics.

Manually running following code resolved my issue (at all places when the visual neighborhood changes due to jQuery show/hide calls):

$(document.body).trigger('sticky_kit:recalc');
$('.fixed-scroll-header').stick_in_parent();

[neotropic2023]

Interesting I had this same issue on a newer website this week. What I discovered... the downloads minified and non-minified are different versions. I would go with the unminified, none of this would happen. Using the minified version, this would do all of this.

[lvne]

Hi sir

https://wisdomhealthwealth.com/articles/entertainment

I have a problem with this i already put this script and its still flashing

$('#sidebar-sticky') .on('sticky_kit:bottom', function(e) { $(this).parent().css('position', 'static'); }) .on('sticky_kit:unbottom', function(e) { $(this).parent().css('position', 'relative'); })

Hope you can help me with this thanks