leafo/sticky-kit

Stick elements are jumping and desappear when scrolling down

Opened this issue · 4 comments

Here is how my code look like;

<div class="container">
      <div class="navbar navbar-default navbar-fixed-top"></div>
     <div id="central"></div>
      <div id="aside_left" style="float:left;"></div>
     <div id="aside_right" style="float:right;"></div>
      <div id="footer"></div>
</div>

My javascript code :
$("#aside_right,#aside_left").stick_parent();

design

The central content is longer than asides and that's why I want asides to stick until the central is total scrolled and then when footer starts scrolling asides and central must scroll too. At my suprise when starting scroll everything is ok; but when the we are about to reach the end of central the asides are jumping and are not visible, leaving the X visible. After reaching the end of the page when I scroll up the asides are becoming visible;

What's wrong? what should I add that I have not added to make it happen?
And sometimes the footer comes over the left aside
design

MrC8 commented

I have the same issue... did you resolved ?

dio5 commented

Same problem here. It seems to depend on whether the 'sticky' element has position: relative or not. If it doesn't, then the wrapper added by this plugin gets position: static, and then it stays visible. If it does, it inherits position: relative and things jump back up.

dio5 commented

See here as well #180

Duplicate of #31