Javascript & CSS Back To Top Button

2 years ago
7

Welcome back to another of my 30 Days Of Frontend Challenges videos. In today's frontend challenge, we're going to build an animated back to top button. We'll have the button hidden by default, but once the user starts to scroll, we'll hide it. When the user clicks it, we'll animate the page back to the top.

My website
https://www.pixelrocket.store

Download project files (you need this if you want to code along):
https://www.dropbox.com/s/v2hzlar1pv67f5n/Day%20Eight%20-%20Back%20To%20Top%20Button.zip?dl=0

30 Days Of Frontend Playlist
https://www.youtube.com/playlist?list=PLCvPStjGyw0eIMVhkIyy7Xyu90vNZwjPr

Window.scroll function
https://developer.mozilla.org/en-US/docs/Web/API/Window/scroll

Timestamps
0:00 Intro
1:55 Setup Button HTML
2:50 Setup Button Styling
7:30 Setup Button Javascript

Loading comments...