i'm creating a loading Screen for a FiveM server, the thing is I want to display a cursor and FiveM doesn't allow that in the loading screen (we can move the mouse, but the cursor is not showing). So in JS i've created a little script to display a cursor*(image)* depending on the mousemove event:
window.onload = function()
{
document.body.addEventListener("mousemove", function(event)
{
var cursor = document.getElementById("cursor");
var x = event.clientX - cursor.width + 23;
var y = event.clientY - 6;
// console.log("x="+x+" - y="+y);
$("#cursor").css({
"left": x+"px",
"top" : y+"px"
});
});
}
My script works well, but not on iframe, the cause is that when the cursor is on the iframe, the JS script doesn't works anymore (it doesn't apply the left/top position so the cursor stays outside of the iframe).
I tried modifying my css but in vain (here it is, i think it will help):
#cursor
{
position: absolute;
z-index: 99999!important;
pointer-events: none;
width: 40px;
}
iframe {
z-index: 1;
}
My question is, is it possible to mouve an image hover the iframe (and still being able to use the iframe) ?
Thanks for your help.