New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.
Already on GitHub? Sign in to your account
Sticky element rely on viewport/contentHeight, even if it's out of viewport #63
Comments
Thanks for using this! I think you have a logic problem here. It's surprisingly hard to get everything right when using the specific events, I usually do an You may need to use |
Problem is Can You please integrate Your suggestion within JSFiddle Demo Thanks |
You might need to use |
Nice that Steps to reproduce it: |
Call recalculateLocations again. |
Kindly check current code that execute when user press "Toggle more contents"[BUTTON] button.onclick = function(){
document.getElementById("morecontents").classList.toggle('hide');
scrollMonitor.recalculateLocations();//Sol#1
//elementWatcher.recalculateLocation()//Sol#2 - Same result as Sol#1
} but duplicating same call(again) also did not work: button.onclick = function(){
document.getElementById("morecontents").classList.toggle('hide');
scrollMonitor.recalculateLocations();//Sol#1
scrollMonitor.recalculateLocations();
//elementWatcher.recalculateLocation()//Sol#2 - Same result as Sol#1
} |
You have to call it when you collapse the content too. |
But i am calling it, as same function is used to expand & collapse using .toggle('hide'); button.onclick = function(){
document.getElementById("morecontents").classList.toggle('hide');
scrollMonitor.recalculateLocations();//Sol#1
//elementWatcher.recalculateLocation()//Sol#2 - Same result as Sol#1
} |
I see. When it's recalculated it's already in the viewport because it has fixed positioning. Try watching the content rather than the button you're changing. |
Really appreciate Your efforts and a nice approach to manage scroll listener. 馃憤
Ref - https://github.com/stutrek/scrollMonitor/blob/master/src/container.js#L168
As it rely on viewport/contentHeight, it cause an issue when we have multiple containers with different heights, So sticky element does not "recalculateLocation" even it's out of viewport.
I tried to explain the problem with a JSFiddle Demo
This Problem fix, if i remove remove a condition but that maybe a wrong fix.
So is this a bug or i am missing something?
Kindly ask if You need more detail. Thanks
The text was updated successfully, but these errors were encountered: