Skip to content

Instantly share code, notes, and snippets.

@AnoRebel
Created January 27, 2023 13:32
Show Gist options
  • Save AnoRebel/ff774840ceebc62f1a84a6d9b77332bc to your computer and use it in GitHub Desktop.
Save AnoRebel/ff774840ceebc62f1a84a6d9b77332bc to your computer and use it in GitHub Desktop.
Dope hacker effect from [Hyperplexed](https://www.youtube.com/W5oawMJaXbU)
<style>
div {
font-family: `Monospaced font`;
}
</style>
<div data-value="AnoRebel">AnoRebel</div>
const letters = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
document.querySelector("div").onmouseover = event => {
let iterations = 0;
const interval = setInterval(() => {
event.target.innerText = event.target.innerText.split("").map((letter, index) => {
if (index < iterations) {
return event.target.dataset.value[index];
}
// return letters[Math.floor(Math.random() * 26)]).join("")
return letters[Math.floor(Math.random() * 26)];
};
if (iterations >= event.target.dataset.value.length) clearInterval(interval);
iterations += 1 /3
}, 30);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment