Interactive online courses HTML Academy
2026-03-09 10:59 Diff
https://htmlacademy.org/courses/javascript-basics/scrolling-and-operators/show-button

We have learned how to determine the amount of vertical scrolling. If the user has scrolled down by more than 200px, then the “Up” button should appear on the page. In the markup, this is an element with the class up-button:

<button class="up-button" type="button"> ↑ <span class="visually-hidden">Up</span> </button>

This is how the button will look in the browser:

Find the button using the querySelector method and write it to a variable.

Initially, the button is not visible, and it should appear if the user scrolls down the page by more than 200px. In order to determine whether the button should be shown, add the onscroll conditional statement to the inside the event handler, and use the greater than comparison operator to compare the scroll value with the number 200:

if (window.pageYOffset > 200) { // If the condition is true, then show the button }

In order for the button to appear, you need to add theshown class to it. Use the classList.add method to accomplish this. Then scroll down the page and make sure that the “Up” button appears.