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

Deprecate fixedHeader in favour of "position: sticky" based solution #98

Open
iant-ee opened this issue Nov 19, 2018 · 5 comments
Open

Comments

@iant-ee
Copy link

iant-ee commented Nov 19, 2018

When you use FixedHeader in Firefox you will see an error in the console:
"This site appears to use a scroll-linked positioning effect. This may not work well with asynchronous panning; see https://developer.mozilla.org/docs/Mozilla/Performance/ScrollLinkedEffects for further details and to join the discussion on related tools and features!"

I intend to switch my application over from using FixedHeader to using position: sticky, as recommended in the above article. Once I have done so I will post my findings here as I suspect it would be better for FixedHeader to either be rewritten making use of position: sticky, or for it to be entirely deprecated and documentation written to help people write their own fixed header CSS.

@DataTables
Copy link
Collaborator

entirely deprecated and documentation written to help people write their own fixed header CSS.

Ultimately, I would love for that to be the case. The last time I checked only Firefox supported poisition:sticky at all. It looks like the other browsers have moved on it a bit but its still buggy (doing it on the th elements oddly).

If Firefox is your main target, then yes, throw FixedHeader out and used position:sticky. For other browsers, for the time being, this is needed.

@iant-ee
Copy link
Author

iant-ee commented Nov 19, 2018

Shame. I did a quick test in Firefox using thead before opening this and it worked great (no lag, which is noticeable at present). Most browsers support it on TH, I think that will be enough for my use case. The main exceptions are IE11 and Opera mini, I'm happy to gracefully degrade for those browsers. Others may not be.

@DataTables
Copy link
Collaborator

I think the main issue with using th is when multiple header rows are used. Reading the Chrome bug on the topic, it appears they have no plan to implement thead support for position:sticky.

@carstenfuchs
Copy link

It seems that Firefox 59+ supports position: sticky also on thead and other table elements. It works for me on thead very well and I think it can even be used to fix the leftmost column.

@DataTables
Copy link
Collaborator

Yup - I've played around with position:sticky in Firefox before and its a fantastic addition. But without support in Blink / Webkit I don't think we can realistically deprecate FixedHeader yet.

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

2 participants