8000 List with dynamically sized elements jumps when refreshed · Issue #73 · tbranyen/hyperlist · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

List with dynamically sized elements jumps when refreshed #73

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.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and priv 7C08 acy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
CodeGradox opened this issue Dec 2, 2024 · 0 comments
Open

List with dynamically sized elements jumps when refreshed #73

CodeGradox opened this issue Dec 2, 2024 · 0 comments

Comments

@CodeGradox
Copy link

I'm implementing a multi-select JS component, and I'm using hyperlist to render the options inside a dropdown.
One feature is to display a description below the option. This requires the options to have a dynamic size, as some options may have a description while others don't.

When an option is clicked, the hyperlist is refreshed to reflect the change. If no options in the list have a description, the list retains its scroll position. However, if there are options which are taller than the set itemHeight, the list jumps to another position.

I have made a codepen to demonstrate the issue. Scroll down a bit, then hit refresh. The list should jump to another position. Note that it does not always jump.
https://codepen.io/Gradox/pen/jENPpbM

I have also noticed that when dragging the scrollbar down, it does not hit the bottom. This is probably due to how the height is calculated?

Here is a demonstration of how the list behaves in my component.
https://github.com/user-attachments/assets/bec028ff-de30-47f8-9acf-8f840ac8faa2
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@CodeGradox
0