I recreated this codepen by @suez in Webflow.
Create the following hierarchy:
<script>
document.addEventListener('DOMContentLoaded', (ev) => {
const circle = document.querySelector('.hover-div');
const circleHalf = circle.offsetWidth / 2;
addEventListener("mousemove", (e) => {
console.log(e.pageX, e.pageY);
circle.style.left = e.pageX - circleHalf + "px";
circle.style.top = e.pageY - circleHalf + "px";
});
});
</script>
The videos Kurzgesagt channel creates are so beautifully animated, that I almost forget that I learn so much while watching them!