マウスカーソルに追従するマーカーを表示させる
const stalker = document.getElementById("js-stalker");
let hovFlag = false;
document.addEventListener("mousemove", function (e) {
if (!hovFlag) {
stalker.style.transform =
"translate(" + e.clientX + "px, " + e.clientY + "px)";
}
});
const linkElem = document.querySelectorAll(
"a:not(.js-no-hov), button, input[type='submit'], #js-scroll-top"
);
for (let i = 0; i < linkElem.length; i++) {
linkElem[i].addEventListener("mouseover", function (e) {
hovFlag = true;
stalker.classList.add("is-hover");
let rect = e.target.getBoundingClientRect();
let posX = rect.left + rect.width / 2;
let posY = rect.top + rect.height / 2;
stalker.style.transform = "translate(" + posX + "px, " + posY + "px)";
});
linkElem[i].addEventListener("mouseout", function (e) {
hovFlag = false;
stalker.classList.remove("is-hover");
});
}
<div class="l-footer-stalker" id="js-stalker"></div>