Actualmente estoy haciendo mi propio juego de cartas con JS. El tablero genera aleatoriamente tu mazo con 5 imágenes y las muestra en la pantalla.
He intentado que cuando hagas clic en una imagen, aparezca en el área de juego, como simulando que has "elegido esa carta" para jugar. Con JQuery:
$("#img5").click ( function() { var carta = document.images["img5"].src; document.images["carta2"].src = carta; } );Ok, pero la cuestión es que solo quiero que eso suceda cuando estás en modo de pantalla completa, así que hice esta lógica:
pantallaCompleta = false; contadorScreen = 0; document.onfullscreenchange = function(event) { contadorScreen = contadorScreen + 1; if(contadorScreen % 2 === 0) { pantallaCompleta = false; console.log("Exiting fullscreen"); console.log(contadorScreen); console.log(pantallaCompleta); } else { pantallaCompleta = true; console.log("Entering fullscreen"); console.log(contadorScreen); console.log(pantallaCompleta); } }; La lógica funciona de modo que cuando carga la página, no está en modo de pantalla completa, por lo que el contador es igual a = 0 y verifica = falso. Luego, cuando document.onfullscreenchange = function(event) sucede contador igual a contador++ y verifique los cambios a verdadero.
Bien, con todo eso combinado y funcionando, trato de poner el código JQuery dentro de esto:
if(pantallaCompleta == true) nunca funciona La console.log(pantallaCompleta); me dice que el cheque es verdadero o falso con precisión, pero el clic en las imágenes nunca funciona.
¿Alguien tiene una idea de lo que podría estar mal?
Actualmente tienes
if(pantallaCompleta == true) { $("#img5").click(function() { var carta = document.images["img5"].src; document.images["carta2"].src = carta; }); }Esto solo establecerá un detector de eventos en img5 si pantallaCompleta es verdadero cuando se ejecuta este código , lo que es probable en la carga de la página.
Le sugiero que desee un detector de eventos que siempre esté asignado (sin importar el estado de pantallaCompleta), pero que verifique si ese valor es verdadero o falso antes de cambiar el img src.
$("#img5").click(function() { if(pantallaCompleta == true) { var carta = document.images["img5"].src; document.images["carta2"].src = carta; } });