It would be really nice to integrate something like Headroom.js (or similar) to the xenForo. There are a few names that are used to describe this function I am talking about. Some call it a Smart Sticky and some call it an Auto-Hide Sticky Header.

Mobile device screens can get crowded fast. Especially when starting a new post.

When using this type of Smart Sticky, the header/navbar automatically hides when you are scrolling down and then appears when you scroll up.

Hide the header as the user scrolls down, and show it again when the user scrolls up. Other apps and websites are already doing this, and it’s pretty sweet. Here is a LINK to another article on implementing the Smart Sticky where the website (Medium) is using the same Smart Sticky feature. There are a bunch of other websites using it (Headroom.js) or some other type of integration that basically does the same thing.

Headroom.js has all this available in an open-source setup ready to go (complete with a Playroom to test out its functions).

I just cannot figure it out. I have spent weeks trying and failing and I am now officially stuck...

I was wondering if someone could help me out getting this code implemented into the newest xenForo so I could use it. I was hoping someone else had already done this and could maybe share their experience with me.

Interactive Playground

  • Like
Reactions: sbj