Custom cursor not working after transformations. Help :(
-
Hello everyone,
I have a problem with my custom cursor on the web page I am making (new-site.estefaniamunoz.com). The combination of the z-index and the transformation to center the cursor makes the cursor not work properly. If I don't give the cursor a transformation, it works, everything is clickable, despite the z-index, but the cursor is not centered.
If I center the cursor, it works again to click the elements when I remove the z-index.Any idea/solution?
CSS
.pointer {
z-index:9999;
background-color: white;
position: fixed;
width: 48px;
height: 48px;mix-blend-mode: difference;}
Javascript
// Custom Cursordocument.addEventListener( "DOMContentLoaded", function () {
// Function to check if the lightbox is active
function isLightboxActive() {
var lightboxRegion = document.getElementById("lightbox-region");
return lightboxRegion && lightboxRegion.classList.contains("lay-hide-images");
}// Append the cursor element jQuery("body").append('<div class="pointer"></div>'); // Update the cursor position on mousemove, and handle visibility based on the lightbox state jQuery("body").on("mousemove", function (e) { let cursor = jQuery(".pointer"); let cursorOffsetX = cursor.width() / 2; let cursorOffsetY = cursor.height() / 2; if (!isLightboxActive()) { cursor.css({ display:"none" }); } else { cursor.css({ top: (e.clientY - cursorOffsetY) + "px", left: (e.clientX - cursorOffsetX) + "px", display:"block" }); } }); // Rotate the cursor by 45 degrees on click jQuery("body").on("mouseenter", "a, img, .img, .elements-collection-region", function () { jQuery(".pointer").css({ transform: "rotate(45deg)", transition: "transform 0.3s ease" }); }); // Reset rotation on cursor when leaving the image jQuery("body").on("mouseleave", "a, img, .img, .elements-collection-region", function () { jQuery(".pointer").css({ transform: "rotate(0deg)", transition: "transform 0.3s ease" }); });});
Thanks!
-
i can see a cursor. its just white
does that mean to you that the cursor is not working?
maybe i don't understand