Tengo lo siguiente trabajando en codepen pero no localmente
https://codepen.io/LoudDesignStudios/pen/RwxPJKY
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="assets/css/css1.css"> </head> <body> <section id="about-us" class=""> s1 </section> <section id="why-choose-us" class=""> s2 </section> <section id="funfacts" class=""> s3 </section> <section id="services" class=""> s4 </section> <section id="studio" class=""> s5 </section> <section id="contactus" class=""> s6 </section> <section id="footer-widgets" class=""> s7 </section> <footer id="footer" class="footer"> footer </footer> <button onclick="topFunction()" id="scrollUp"><i class="las la-chevron-up" aria-hidden="true"></i></button> <script> var mybutton = document.getElementById("scrollUp"); window.onscroll = function() {scrollFunction()}; function scrollFunction() { if (document.body.scrollTop > 60 || document.documentElement.scrollTop > 60) { mybutton.style.display = "block"; } else { mybutton.style.display = "none"; } } function topFunction() { document.body.scrollTop = 0; document.scrollTop = 0; document.documentElement.scrollTop = 0; } </script> </body> </html>Los mismos códigos que funcionan en otros sitios web creados hace un tiempo y aún funcionan comenzando desde cero ahora que window.scroll no se activa.
Gracias.
Es porque está tratando de obtener un elemento ( mybutton ) por su ID antes de que el contenido del documento esté completamente cargado.
Deberá envolver su código dentro de un controlador de eventos DOMContentLoaded . A continuación se muestra una versión ligeramente modificada de su código JavaScript:
document.addEventListener("DOMContentLoaded", function () { var mybutton = document.getElementById("scrollUp"); window.onscroll = function () { scrollFunction() }; function scrollFunction() { if (document.body.scrollTop > 60 || document.documentElement.scrollTop > 60) { mybutton.style.display = "block"; } else { mybutton.style.display = "none"; } } }); function topFunction() { document.body.scrollTop = 0; document.scrollTop = 0; document.documentElement.scrollTop = 0; }