[Résolu] Un plein écran qui supprime la scrollbar

[L'Omniscient]

Hello les gens,
J'ai un dernier bug sur ma V1 que je n'arrive pas à corriger.
J'ai choppé un code de plein écran sur le net, sauf que ce code supprime la scrollbar !
J'ai beau essayer de forcer l'apparition de la scrollbar en CSS (attribué par JS ou non), mais rien n'y fait.
D'autre part, le code a une structure un peu complexe... (J'ai peut-être pas pris le code le plus simple, j'avoue).
Si vous pouvez m'aider à régler ce soucis ce serait super.
(Je peux bien essayer des alternatives en JS mais ce serait bien plus simple et pratique de juste réhabiliter la scrollbar).

Voilà le code :

!function(){

var a = "undefined" != typeof module && module.exports,

b = "undefined" != typeof Element && "ALLOW_KEYBOARD_INPUT" in Element,

c=function () {

for(

var a,b,c=[

["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],

["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],

["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],

["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],

["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]

],

d=0, e=c.length, f={};

e > d;

d++

)

if(a=c[d],a&&a[1]in document){

for(d=0,b=a.length;b>d;d++)

f[c[0][d]]=a[d];

return f

}

return!1

}(),

d={

request:function(a){

var d=c.requestFullscreen;

a=a||document.documentElement,/5\.1[\.\d]* Safari/.test(navigator.userAgent)?a[d]():a[d](b&&Element.ALLOW_KEYBOARD_INPUT)

},exit:function(){

document[c.exitFullscreen]()

},toggle:function(a){

this.isFullscreen?this.exit():this.request(a)

},raw:c

};

return c?(Object.defineProperties(d,{

isFullscreen:{

get:function(){return Boolean(document[c.fullscreenElement])}

},element:{

enumerable:!0,get:function(){return document[c.fullscreenElement]}

},enabled:{

enumerable:!0,get:function(){return Boolean(document[c.fullscreenEnabled])}

}

}),void(a?module.exports=d:window.screenfull=d)):void(a?module.exports=!1:window.screenfull=!1)

}();

Merci !

PS : Xenos je sais que le bouton plein écran te semble inutile puisque le navigateur possède la fonctionnalité similaire, mais j'y tiens à ce bouton

[Xenos]

C'est une règle du navigateur que de masquer les barres de scroll me semble-t-il. Il te suffit de vérifier avec un "overflowcroll" dans tes règles CSS, et de voir le résultat.

(et tu y tiens pour quelle raison? Parce que "les utilisateurs ne savent pas se servir de leur navigateur"? si c'est ça, rajoute un bouton "top", un "refresh", un "précédent"/"suivant" avec N niveaux [comme quand on clique droit sur précédent/suivant de Firefox], un ajout aux favoris, un print, un...)

---

Okay, cela peut faire sens de passer un élément de la page en full screen (genre, la vidéo youtube... à mon avis, cette spec doit venir de chez Google ^^).

Démo de test (avec les fameuses scrollbars)

Mais je pense que c'est se prendre le choux pour pas grand chose... Tu comptes appliquer ce système dans quel contexte ?

[L'Omniscient]

J'ai déjà essayer d'ajouter des overflow et overflow-y dans tous les sens, CSS et Javascript, aux bodys, aux divs etc, rien n'y fait. Je crois même que je ne peux pas faire défiler la page du tout (comme si elle était carrément coupée, en gros un overflow: hidden).
Je vais réessayer.

J'y tiens parce que, je n'utilise jamais le bouton plein écran car il me semble que ce n'est pas adapté à de la navigation web. Cependant, lorsqu'on reste sur une page unique longuement, je pense que ça peut ajouter de l'immersion (sauf que je n'imaginerais jamais aller sur le plein écran, je ne regarde le navigateur lorsque je suis sur une page web, sauf pour chercher codes sources, onglets techniques, options, fermer la page etc). Je pense qu'un bouton dans la page elle-même permet à l'utilisateur de prendre plus conscience de cette possibilité de plein écran. D'autant plus que, lorsqu'on clique sur ce bouton, le jeu s'adapte à la taille de la fenêtre, ce qui ne se produit pas si on utilise le plein écran du navigateur.

L'ensemble du jeu est utilisable en plein écran via ce bouton. Le soucis c'est que j'ai pas pensé au petit forum que j'ai mis... C'est le seul élément scrollable, et je me suis rendu compte que ça scrollait pas :x
Bon, au pire, je compte changer l'emplacement du forum, donc au final le problème sera résolu (je viens d'y penser ). Mais si je pouvais avoir un code sans erreur ce serait top

Ah ouai, ton exemple marche super bien. Mais je suis bête, j'ai pris un code galère alors que je pense que j'aurai pu en coder un pas compliqué. Je devais en avoir marre de coder ce jour là >.>

[Xenos]

A mon avis, méfies-toi car le fullscreen du navigateur n'est pas le fullscreen de l'API javascript (le premier est "navigateur, cache-moi toutes tes barres" alors que le 2nd est "affiche-moi tel élément du site en plein écran"). Dans 6 mois, cela risque de finir en "c'est quoi ce code de merde inutile plein de préfixes que j'ai ajouté?!".

Si tu veux juste faire prendre conscience que, en plein écran, cela te semble mieux, alors autant juste afficher un message type "Plein écran: F11" (si besoin, à adapter en fonction du navigateur de l'utilisateur, cette touche n'étant pas forcément standard).

[L'Omniscient]

Bon, du coup je vais effectivement pas me prendre la tête là dessus, puisque la section pour les avis et bugs va être ajouté en-dehors du forum, et je vais faire une suppression de plein écran automatique à la sortie du jeu web.
Par contre je garde le code pour l'instant parce que je le trouve bien utile ^_^

(Ya pas un bouton résolu ? Parce que je voudrais poster une autre demande, mais je veux pas polluer la section avec mes demandes >...<)