Why does my “Back to Top” button fail on Firefox?

Question

I want to do a simple back to top button, and it works on all browsers but Firefox. I don't know what the problem is. Any help?

Script:

  $(document).ready(function () { $(window).scroll(function () { if ($(this).scrollTop() > 320) { $('.scroll-box').fadeIn(); } else { $('.scroll-box').fadeOut(); } }); $('.scroll-box').click(function () { $("html, body").animate({ scrollTop: 0 }, 400); return false; }); }); 

  .scroll-box {display: none; position: fixed; bottom: 2px; right: 20px; width: 32px; height: 32px;} .scroll-box:after {content: 'TOP';} 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <a href="#" class="scroll-box" title="Back to top"></a> 

Answer 1

I cannot reproduce any problems your code works just fine for me. But I'd like to bring window.scrollTo to your attention. It's a native browser method that does exactly what you want without any dependencies:

window.scrollTo({
  top: 0,
  left: 0,
  behavior: 'smooth'
});

You cannot chose the duration of the smooth scroll. But do you really need that anyway?

Answer 2

This code is being blocked by uBlock Origin. Thanks @Kaddath for the insight.