/Scroll-To-Top

Scroll to top button

Primary LanguageJavaScript

SCROLL TO TOP

This is a simple library that speaks for itself. It adds the logic of a button that, when clicked, scrolls to the top. Demo

All necessary files you can find in downloadMe/ folder

Quick start

HTML

Add tag with class stt

<div class='stt'></div>

JS

<script defer src="scrollToTop-min.js"></script>

With the setting finished, when you click on the tag, the page will scroll to the top.

Costum styles

If you want to style your scroll to top button by yourself. Don't forget to write these styles into your css file. Without these styles, scrollToTop.js will not hide the button when needed.

        .stt {
            visibility: hidden;
            opacity: 0;
            transition: 0.3s ease-in-out;
        }

        .stt__active {
            visibility: visible;
            opacity: 0.5;
        }

CSS

<link rel="stylesheet" href="scrollToTop.css">

Stylying

You can change the styles of the buttons simply by adding the example classes below ↓.

 <div class='stt stt__block_black'></div>
Class Style
<div class='stt stt__block_black'></div> stt__block_black
<div class='stt stt__circle__black'></div> stt__circle__black
<div class='stt stt__emoji'></div> stt__block_black