Javascript returns the button implementation method at the top, and javascript returns the top

Javascript returns the button implementation method at the top, and javascript returns the top

This article introduces how to implement the buttons at the top of javascript return and shares them with you for your reference. The details are as follows:

Html:

<A href = "javascript:;" id = "btn" title = "Back to Top"> </a>

Css:

#btn{position:fixed;display:none;}

Script:

Obtain the scroll bar height:Document.doc umentElement. scrollTop | document. body. scrollTop

Obtain the height of the visible area:Document.doc umentElement. clientHeight
Js Code

Window. onload = function () {var obtn = document. getElementById ('btn '); // obtain the height of the page visible area var clientHeight = document.doc umentElement. clientHeight; var timer = null; var isTop = true; window. onscroll = function () {var osTop = document.doc umentElement. scrollTop | document. body. scrollTop; if (osTop> = clientHeight) {// display button obtn. style. display = 'block';} else {// hide the button obtn. style. display = 'none';} if (! IsTop) {clearInterval (timer) ;}istop = false ;}; obtn. onclick = function () {// set timer = setInterval (function () {// obtain the height of the scroll bar from the top var osTop = document.doc umentElement. scrollTop | document. body. scrollTop; var ispeed = Math. floor (-osTop/6); document.doc umentElement. scrollTop = document. body. scrollTop = osTop + ispeed; isTop = true; if (osTop = 0) {clearInterval (timer) ;}, 30 );};};

I hope this article will help you learn about javascript programming.

Articles you may be interested in:

• How does js + JQuery return to the top?
• Javascript returns the top result (self-written code)
• Introduction to a simple JS Code implementation on the top of elastic return
• JQuery's return to the top function is suitable for browsers that do not support js.
• Javascript to implement the "Back to Top" button in the lower right corner of the blog garden page
• Js simple click to return the top effect implementation method
• Implementation of returning the top button in javascript