sticky-sidebar
sticky-sidebar copied to clipboard
Sticky bottom bug when the page refreshed at bottom
When the page refreshed at bottom, the sidebar will stick way above the container bottom line. It seems the problem is this sticky sidebar calculated the page dimension before the images loaded. So when the images loaded (images on content, because my images on sidebar have fixed dimension while the ones on content designed to be responsive) this will make the page getting taller and sticky sidebar stuck above the bottom. When the screen resized, sticky sidebar will recalculate the dimension and will work correctly.
Not that this is a big problem because people won't refresh page while at bottom page, but maybe this can be perfected.
You should put the code inside a $(window).load
or window.onload
call, so it doesn't run until all images have loaded. I'm surprised you don't have this issue even on initial page loads.
@zom243 try to call updateSticky()
method on your sticky sidebar object right after you initialize it. See if this solves your issue.
init
window.stickySidebar = new StickySidebar('#sticky_sidebar');
and when the page refreshed at bottom
if (typeof window.stickySidebar !== 'undefined') window.stickySidebar.updateSticky();