Skip to content
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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Twitch when sticky el is taller than viewport #118

Open
alvarix opened this issue Jun 18, 2020 · 4 comments
Open

Twitch when sticky el is taller than viewport #118

alvarix opened this issue Jun 18, 2020 · 4 comments

Comments

@alvarix
Copy link

alvarix commented Jun 18, 2020

The inline height of the sticky div starts bouncing, usually by 6px.

@ustenko
Copy link

ustenko commented Jun 22, 2020

have the same problem, when init StickySidebar after page scrolling

@LedzZm
Copy link

LedzZm commented Oct 8, 2020

Any proposed solution to this?

@LedzZm
Copy link

LedzZm commented Oct 12, 2020

Coming back to this... seems like the problem is not the element being taller than the viewport but taller that it's containing element.

That could be caused by broken floats in older projects or vertical margins on block elements inside the container etc...

In that case the sticky-sidebar.js:315 is always falsy and enters an event loop of (becoming sticky -> repositioning the element -> recalculating -> stop being sticky -> recalculating (not having the secondary condition met) -> looping again.

My explanation might be a bit messy, but its kinda hard to paint the picture without... well... painting a picture :P

tl;dr: Make sure the sticky elements height does not exceed its container.

@Namstel
Copy link

Namstel commented May 17, 2021

I ran into this issue when having elements with top and bottom margins in my sidebar. The solution for me was to apply overflow: auto; to the element where the children had the margins.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants