Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <!--Put the following CSS Code into the CSS Code box to tidy it up a bit.-->
- /* START */
- #myBtn {
- display: none;
- position: fixed;
- bottom: 25px;
- right: 25px;
- z-index: 99;
- border: none;
- outline: none;
- background-color: green;
- color: white;
- cursor: pointer;
- padding: 20px;
- border-radius: 13px;
- }
- #myBtn:hover {
- background-color: #555;
- }
- /* END */
- </head>
- <body>
- <button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
- <!--You have to leave the JS in the script tag because there is an issue with it for some reason, I have tested.-->
- <script>
- // When the user scrolls down 20px from the top of the document, show the button
- window.onscroll = function() {scrollFunction()};
- function scrollFunction() {
- if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
- document.getElementById("myBtn").style.display = "block";
- } else {
- document.getElementById("myBtn").style.display = "none";
- }
- }
- // When the user clicks on the button, scroll to the top of the document
- function topFunction() {
- document.body.scrollTop = 0;
- document.documentElement.scrollTop = 0;
- }
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement