codepens/super-smash-bros-credits/dist/script.js

27 lines
1016 B
JavaScript

// just for crosshairs positioning
window.addEventListener("DOMContentLoaded",() => {
const credits = new SSBCredits(".credits");
});
class SSBCredits {
constructor(sel) {
this.el = document.querySelector(sel);
this.el?.addEventListener("click",this.crosshairsUpdate.bind(this));
}
crosshairsUpdate(e) {
const { pageX, pageY } = e;
if (pageX > 0 && pageY > 0) {
const { offsetWidth, offsetHeight, offsetLeft, offsetTop } = this.el;
const x = Math.round(pageX - offsetLeft - offsetWidth / 2);
const y = Math.round(pageY - offsetTop - offsetHeight / 2);
this.el.style.setProperty("--crosshairsX",`${x}px`);
this.el.style.setProperty("--crosshairsY",`${y}px`);
this.el.style.setProperty("--hitVisibility","visible");
} else {
// hide the red box and do nothing to the crosshairs if keypress
this.el.style.setProperty("--hitVisibility","hidden");
}
}
}