This button move you to top of the page.
It's can be usefull in long web pages.
- Add the html code to anywhere inside body tags in your html file.
<div id="up" onclick="pageUp()">
<div class="up-bg">
<img src="images/jet.png" alt="tap to up">
</div>
<div id="up-text">Page Up</div>
</div>
- Add the 'up.css' file to your project and describe the file path.
- Add the js file to your project and describe the file path in end of the body tag.
To set when the button is visible Change the scrollSize variable's value in the pageUp.js file. If you set a higher value the button will be visible more lately.
https://github.com/yasinkarax/scroll-to-tap-button.git
You can use an icon or image for the button.
If you want to use icon, i recommend Font Awesome. To add Font Awesome to your project, add Font Awesome Kit to your code, then add the html icon code inside the up--bg class div.
https://fontawesome.com/docs/web/setup/use-kit
Or you can add image inside div with up--bg class like me.
The button have smooth scrolling behaviour by default.
You can disabled it by delete the scroll-behavior: smooth;
code in main css file.