Ich habe in letzter Zeit an Front-End-Projekten gearbeitet, und viele Projekte haben die Anforderungen, an die Spitze zurückzukehren. Im Folgenden werde ich meinen JS -Code schreiben, um in Zukunft einen Aufzeichnung zu erstellen, um es einfacher zu suchen.
Ich stellte fest, dass der Animationseffekt von schnell zu langsam und die Funktion, die Bildlaufleiste nach unten zu ziehen, um jederzeit zu scrollen. Ich habe auf die relevanten Kurse zu IMOOC verwiesen und schließlich den JS -Code wie folgt implementiert:
// Trigger Window.onload = function () {var btn = document.getElementById ('btn'); var timer = null; var istop = true; // Die Seitenansichtsbereich Höhe var clientHeight = document.documentElement.clientHeight; // Trigger -Fenster. document.body.scrolltop; if (ostop> = clientHeight) {btn.style.display = "block";} else {btn.style.display = "none";}; // im Prozess zurück nach oben, das Benutzer scrolls die Scrollbar und stoppt den Timer if (! false;}; btn.onclick = function () {// Timer Timer = setInterval (function () {// Die Höhe des ScrollBar aus dem oberen var ostop = document.documentElement.scrolltop || document.body.scrolltop; document.body.scrolltop = ostop+ispeed; // nach oben hinzufügen den Timer if (ostop == 0) {ClearInterval (Timer);}; istop = true;}, 30);};};Der obige Inhalt ist der Animationscode basierend auf der von JavaScript basierenden Implementierung zurück nach oben auf der vom Editor eingeführten Seite. Der Code ist einfach und leicht zu verstehen. Es sind nicht zu viele Kommentare an Sie beigefügt. Wenn Sie während des Referenzvorgangs Fragen finden, hinterlassen Sie mir bitte eine Nachricht. Der Herausgeber wird Ihnen rechtzeitig antworten!