Does anyone know how to use javascript to change the cursor to a custom image by updating the cursor property of the entire page? I'm getting an error in the Chrome console that says:
projetFinalPage1.html:626 Uncaught TypeError: Cannot read property 'style' of null
at changeCursorGun (projetFinalPage1.html:626)
at HTMLInputElement.onclick (projetFinalPage1.html:548)
changeCursorGun @ projetFinalPage1.html:626
onclick @ projetFinalPage1.html:548
Here is the code snippet causing the issue:
function changeCursorGun(){
document.getElementById("pageCombatAlien").style.cursor = "url('images/gunCursor')";
}#pageCombatAlien{
display: none;
cursor: default;
}<div id="pageCombatAlien">
<div id="backgroundCombatAlien">
<div id="texteCombatAlien">
La voici la fameuse créature que mon détecteur a capté ! Je ne peux pas m'enfuir, car elle me rattarpera.
</div>
<input type="image" src="images/chest.png" onclick="changeCursorGun()" id="chest">
<div id="healthBorder">
<div id="health"></div>
</div>
<input type="button" onclick="healthLoss()" id="boiteClickAlien">
</div>
</div>