Bonjour à tous,
Il y a quelque chose que je n'arrive pas à faire avec mon site.
En voici un exemplaire pour illustrer et vous permettre de le visiter vous-même : http://epichardjump.com/Imaginary/index.html
Comme vous le voyez, en haut à droite de l'image principale, il y a une croix permettant de ranger la barre de droite. C'est sur cette croix que je souhaite qu'en appuyant, en plus de ranger le menu de droite, le navigateur passe en plein écran.
J'ai déjà essayé différents codes comme ceux-ci :
ou encore :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25 <script type="text/javascript"> document.querySelector( ".toggle" ).addEventListener( "click", function(oEvent) { oEvent.preventDefault(); function toggleFullScreen() { if ((document.fullScreenElement && document.fullScreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) { if (document.documentElement.requestFullScreen) { document.documentElement.requestFullScreen(); } else if (document.documentElement.mozRequestFullScreen) { document.documentElement.mozRequestFullScreen(); } else if (document.documentElement.webkitRequestFullScreen) { document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT); } } else { if (document.cancelFullScreen) { document.cancelFullScreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } } } } ); </script>
Mais ça ne fonctionne pas. A mon avis, le problème est que je ne parviens pas à identifier précisément le bouton (la croix) dans le code, et donc logiquement que je n'arrive pas à lui attribuer une commande.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23 document.querySelector( ".toggle" ).addEventListener( "click", function(toggleFullScreen()) { toggleFullScreen.preventDefault(); { if ((document.fullScreenElement && document.fullScreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) { if (document.documentElement.requestFullScreen) { document.documentElement.requestFullScreen(); } else if (document.documentElement.mozRequestFullScreen) { document.documentElement.mozRequestFullScreen(); } else if (document.documentElement.webkitRequestFullScreen) { document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT); } } else { if (document.cancelFullScreen) { document.cancelFullScreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } } } } );
Bien sûr je vous invite à voir par vous même le code avec la console développeurs de votre navigateur, et je reste à votre disposition pour vos questions.
Merci par avance !
Partager