summaryrefslogtreecommitdiff
path: root/assets/js/morph.js
diff options
context:
space:
mode:
Diffstat (limited to 'assets/js/morph.js')
-rw-r--r--assets/js/morph.js54
1 files changed, 27 insertions, 27 deletions
diff --git a/assets/js/morph.js b/assets/js/morph.js
index 728ff1f..aea6dff 100644
--- a/assets/js/morph.js
+++ b/assets/js/morph.js
@@ -1,43 +1,43 @@
const CHARS = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789@._-";
function morph(element, target) {
- clearInterval(element._timer);
+ clearInterval(element._timer);
- const start = element.textContent;
- const length = Math.max(start.length, target.length);
+ const start = element.textContent;
+ const length = Math.max(start.length, target.length);
- let progress = 0;
+ let progress = 0;
- element._timer = setInterval(() => {
- progress += 0.05;
+ element._timer = setInterval(() => {
+ progress += 0.05;
- const currentLength = Math.round(
- start.length + (target.length - start.length) * progress
- );
+ const currentLength = Math.round(
+ start.length + (target.length - start.length) * progress
+ );
- let output = "";
+ let output = "";
- for (let i = 0; i < currentLength; i++) {
- if (progress > i / currentLength + 0.2 && target[i]) {
- output += target[i];
- } else {
- output += CHARS[Math.floor(Math.random() * CHARS.length)];
- }
- }
+ for (let i = 0; i < currentLength; i++) {
+ if (progress > i / currentLength + 0.2 && target[i]) {
+ output += target[i];
+ } else {
+ output += CHARS[Math.floor(Math.random() * CHARS.length)];
+ }
+ }
- element.textContent = output;
+ element.textContent = output;
- if (progress >= 1) {
- clearInterval(element._timer);
- element.textContent = target;
- }
- }, 15);
+ if (progress >= 1) {
+ clearInterval(element._timer);
+ element.textContent = target;
+ }
+ }, 15);
}
for (const link of document.querySelectorAll(".morph")) {
- const original = link.textContent;
- const alternate = link.dataset.alt;
+ const original = link.textContent;
+ const alternate = link.dataset.alt;
- link.addEventListener("mouseenter", () => morph(link, alternate));
- link.addEventListener("mouseleave", () => morph(link, original));
+ link.addEventListener("mouseenter", () => morph(link, alternate));
+ link.addEventListener("mouseleave", () => morph(link, original));
}