DEV Community

Discussion on: React Component to Smooth Scroll to the Top

Collapse
 
darkwiiplayer profile image
𒎏Wii 🏳️‍⚧️

I had to build a similar thing a while ago, but without any framework; ended up with much less code by simply adding a scroll event handler that toggles a top class on the body element. The CSS then just has a rule like .top .scroll-to-top { opacity: 1 }

Collapse
 
prnvbirajdar profile image
Pranav Birajdar

Damn! That's awesome. Do you have a demo by any chance?

Collapse
 
darkwiiplayer profile image
𒎏Wii 🏳️‍⚧️

cc-entrance.comcard.de Ignore the fact that it's in German 😁

Also there's a few additional effects other than just fading in and out, which obviously makes the CSS a bit more complex.

Thread Thread
 
prnvbirajdar profile image
Pranav Birajdar • Edited

This looks so good! I just looked at the event code and the underlying function is almost the same. It's just less code due to being written in pure HTML and CSS I reckon. Correct me if I am wrong!

Thread Thread
 
darkwiiplayer profile image
𒎏Wii 🏳️‍⚧️

Yea, I don't think the way I do it is all that different from yours, the only detail that really changes is that I use more of the CSS cascade in an attempt to make it more "generic" :D