Sparkle On Click

mouse and cursor 2000 still works

Throws a burst of sparks wherever you click.

In 2026: Works unchanged.

Where it came from: A later cousin of the mouse trail scripts, roughly 2000. MDN ↗

<script language="JavaScript">
document.onclick = function (e) {
  for (var i = 0; i < 12; i++) {
    (function (n) {
      var s = document.createElement("div");
      s.innerHTML = "\u2734";
      s.style.cssText = "position:fixed;pointer-events:none;z-index:9999;"
        + "font-size:12px;color:hsl(" + (n * 30) + ",100%,60%);"
        + "left:" + e.clientX + "px;top:" + e.clientY + "px;"
        + "transition:all .6s ease-out";
      document.body.appendChild(s);
      setTimeout(function () {
        s.style.left = (e.clientX + Math.cos(n) * 60) + "px";
        s.style.top  = (e.clientY + Math.sin(n) * 60) + "px";
        s.style.opacity = "0";
      }, 10);
      setTimeout(function () { s.parentNode.removeChild(s); }, 700);
    })(i);
  }
};
</script>

sandboxed demo · breaks nothing but itselfrestart

More in mouse and cursor