Discussion on "How to make Hashnode like Scroll Aware Toolbar using Framer Motion"

Ammar Mirza · 2024-06-20T04:52:18.483Z

Hola!Today, we will create a simple scroll-aware toolbar, like the one you see while reading a blog on Hashnode but using Framer Motion. Boilerplate Setup I will bootstrap the project with Nextjs for its built-in Tailwind support, but you can use Rea...

Using useMotionValueEvent to track scroll direction instead of raw scroll listeners is much cleaner — the threshold-based show/hide avoids the flicker you get with naive implementations.

Really helpful Ammar Mirza

Glad you found it helpful!

Hey Amar I am new here I have read your blog for first times really the information you shares is amazing !!

Thanks for reading Arya. Stay tuned for more such articles.

Nice approach Ammar Mirza !. We did evaluate using framer at the time when implementing but resorted to vanilla js since we didn't want to add one more additional dep. But the DX with framer is more intuitive ✨

Thanks for reading 😀

Discussion

How to make Hashnode like Scroll Aware Toolbar using Framer Motion

Responses(8)

Recent discussions

Search Hashnode

How to make Hashnode like Scroll Aware Toolbar using Framer Motion

Responses(8)

Recent discussions