<body> docked class not removed when scrolling back to the top?

Hi.
When we start scrolling, the class docked appears on <body>.
But when we scroll back to the top, the class docked remains.

Is that supposed to be this way :thinking:? I’d like to make the header different when it goes sticky, and I currently can’t because of this.

4 Likes

Maybe @awesomerobot will know?

2 Likes

If I remember correctly the docked class is meant for additional content added to the header (in the Header section of a theme). You can add a line of text to Header to see the class show/hide as expected.

So unless you have custom header content, the header is docked at scroll and stays that way permanently.

At one point ages ago (think 4+ years) we undocked the header at the top of the page… but that regressed, went unnoticed for a long time, and then we decided to adopt the regression.

We can likely improve it, the current behavior causes a little initial “pop” as you scroll for the first time (hard refresh to see it)… but we do have to be very careful to not break all the existing header cusotmizations out there (there are lots of them!). It might make sense to wait a little bit longer (until we drop IE11) and then look at making more significant improvements along with it, like using position: sticky; instead of fixed.

9 Likes

I’m not sure if your reply also implies this but in the future, if it is possible to have a specific class when the header goes sticky that would be neat. A lot of site these days use large, tall headers and I was asked several times to customize a Discourse forum to have such a header. But a tall header means it has to be resized when we scroll and a pre-existing class would be perfect for that.

5 Likes

oh yes sorry, I didn’t imply that very clearly. I do think it would be something helpful we should add!

5 Likes

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.