Este artículo ha compartido el efecto de JavaScript a la cima para su referencia. El contenido específico es el siguiente
<! DocType html> <html lang = "en"> <head> <meta charset = "utf-8"> <meta http-oquiv = "x-ua compatible" content = "ie = edge, chrome = 1"> <title> back to top Effect (native js) </title> <style type = "text/css"> {margen margin. } .bg {ancho: 1022px; margen: 0 auto; } .btn {display: none; Ancho: 75px; Altura: 75px; Antecedentes: URL (../ Imágenes/Icono Small Web Small (volver a la parte superior)/Regresar a Top-085.png) No se repite a la izquierda Top; Posición: fijo; Izquierda: 50%; margen izquierda: 530px; Abajo: 10px; text -indent: -9999px; Esquema: ninguno; } .btn: hover {Posición de fondo: 0 -75px; } </style> <script> var timer = null; var isscroll = true; //1. if (Ostop == 0) {// juzga el alcance de la parte superior, limpie el temporizador ClearInterval (temporizador); } isscroll = true; } window.Onload = function () {var obtn = document.getElementById ('btn'); // Obtener el elemento de botón var clientHeight = document.documentelement.clientHeight || document.body.clientHeight; // 1. Haga clic en el evento de retorno del botón Btn.OnClick = function () {// Atagar el botón Haga clic en Event Timer = SetInterval (Oscroll, 50); } window.onscroll = function () {var ostop = document.documentelement.scrolltop || document.body.scrolltop; // 1.1 Altura de desplazamiento, compatible if (ostop> clientheight) {btn.style.display = "bloque"; } else {btn.style.display = "ninguno"; } if (! isscroll) {ClearInterval (temporizador); } isscroll = false; }} </script> </head> <body> <div> <img src = "../ images/jz.jpg"> </div> <a href = "javascript: void (0);" id = "btn"> volver a arriba </a> </body> </html>Lo anterior se trata de este artículo, y espero que sea útil para todos aprender la programación de JavaScript.