TanStackT
TanStack3y ago
5 replies
foolish-indigo

sticky header for virtualized table gets scrolled after scrollTop reaches table height

I have an issue with a virtualized table with a sticky header.
Apparently the sticky css suppose that scrollTop of the container is less than the height of the content being scrolled.
But for virtual lists this is not true, because height of the content is quite fixed = (overscan * 2 + number of visible rows)*rowHeight , but the conteiner's scrollTop property being increased as you scroll.
That way, after you scroll to the point when scrollTop is bigger than the content's height, sticky header gets scrolled up together with the rows. (it will flicker unpleasantly before doing so).

How does everyone deals with this behavior?
Was this page helpful?