angular-sticky
angular-sticky copied to clipboard
Want it Sticky only after scrolling past other bottom elements
Love this plugin and I am using this in my Angular 1.5.9. and it works. However, I want to know if something like this possible.
I want the sticky element to become sticky only after the other bottom divs are scrolled. For example, I have a left side bar like this:
<div class="block-1 avatar" hl-sticky="" offset-top="50">
<!-- STICKY AVATAR -->
</div>
<div class="block-2 statistics">
<!-- SOME STUFF -->
</div>
<div class="block-3 comments">
<!-- SOME STUFF -->
</div>
<div class="block-4 recommendations">
<!-- SOME STUFF -->
</div>
At the moment, it is sticky from the moment the block-1 avatar
is scrolled so it overlaps on the other bottom divs on scrolling.
What I want is, I want the above left bar divs to be relative during scroll and I only want the block-1 avatar
to become sticky after the user has scrolled past block-4 recommendations
.
I read the API and not sure if there is a setting for it. Is the above possible?
Thanks, Neel.