Skip to content

Sal127/Scroll-To-Top

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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

About

Scroll to top button

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 57.6%
  • SCSS 18.1%
  • CSS 17.0%
  • HTML 7.3%