← All examples

JavaScript Productivity

Scroll-to-top button in the corner

Adds a floating button that appears after scrolling and smoothly returns you to the top.

Code to copy

var btn = document.createElement('button');
btn.textContent = '↑';
btn.setAttribute('aria-label', 'Scroll to top');
btn.style.cssText = 'position:fixed;right:20px;bottom:20px;width:44px;height:44px;' +
  'border:none;border-radius:50%;background:#2563eb;color:#fff;font-size:20px;' +
  'cursor:pointer;z-index:2147483647;box-shadow:0 2px 8px rgba(0,0,0,.3);display:none;';
btn.addEventListener('click', function () {
  window.scrollTo({ top: 0, behavior: 'smooth' });
});
document.body.appendChild(btn);
window.addEventListener('scroll', function () {
  btn.style.display = window.scrollY > 400 ? 'block' : 'none';
}, { passive: true });

How to use this example

  1. Copy the code with the button above.
  2. Install JustZix (2 minutes) and open the extension on the target page.
  3. Add a new rule matching that page.
  4. Paste the code into the rule's JavaScript panel and save — it runs on every page visit.

Rate this example

No ratings yet — be the first.

Does this example work?

Snippets are useless without somewhere to paste them.

JustZix takes 2 minutes to install and runs your code on every matching page. No account, no payment.

Download free See use cases