[RESOLU] Barre d'adresse, largeur personnalisée (à défaut de : Barres d'outils supplémentaires)

Vos requêtes concernant Mozilla Firefox, le navigateur Gecko alternatif, ne trouvèrent point de réponses lorsque vous cherchâtes ? Toute l'équipe Geckozone est prête à vous aider.

Modérateurs : nico@nc, Mori, jpj, myahoo

Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

[RESOLU] Barre d'adresse, largeur personnalisée (à défaut de : Barres d'outils supplémentaires)

Message par Gloops »

Bonjour tout le monde,

Je ne suis pas tout-à-fait sûr d'avoir le bon vocabulaire pour ce que je vais dire, alors je commence par poser les choses : je vais distinguer la zone d'adresse, où on tape l'URL, de la barre d'adresse, où elle se trouve.

La barre d'adresse joue un rôle stratégique, en ce sens qu'en dehors de la barre des onglets, c'est la seule qui soit visible en plein écran (en y faisant venir la souris). Pour cette raison il y a pas mal de monde, là-dessus, ce qui réduit la largeur visible de la zone d'adresse.

J'ai donc finassé comme suit :

Code : Tout sélectionner

 /*largeur minimum de la barre d'adresse*/
#main-window[sizemode="maximized"] #urlbar-container:hover {
    min-width: 1000px !important;
}   

#main-window[sizemode="maximized"] #urlbar-container {
    min-width: 480px !important;
    width:480px !important;
    max-width: 480px ! important;
}   
Ça me permet de voir l'URL sur une plus grande largeur en plaçant le curseur de la souris dessus, et de la laisser se replier en retirant le curseur de la souris.

Il y a un corollaire fâcheux à cela, c'est que les boutons qui se trouvent à droite sont rejetés dans la zone de la barre d'outils qui n'apparaît qu'en cliquant sur le chevron à droite (là aussi il y a un mot pour ça, tiens ce n'est pas le jour).

J'ai eu un problème de lecture à l'instant car pour moi sizemode="maximized" c'était le plein écran. Non, c'est la fenêtre agrandie, considérée parmi les trois modes d'affichage de fenêtre sous Windows : agrandi, intermédiaire, réduit en icône. Je peux désactiver mon redimensionnement au passage de la souris en mettant la fenêtre en mode d'affichage intermédiaire, quitte à l'agrandir aux dimensions de l'écran.

Comme on peut se douter le problème est avec les boutons qui sont éjectés dans la zone non visible : ils ne reviennent pas quand j'enlève le curseur de la souris, et la droite de la barre d'adresse reste dégarnie.

Ça, ça fait un moment, et aujourd'hui j'ai plus gênant : c'est le cas aussi du bouton "plein écran", qui est pourtant à gauche de la barre d'adresse.

Les premières solutions qui viennent à l'esprit pour une page web dont je serais l'auteur, serait de mettre dans un panel (une division) les contrôles que je veux garder groupés, ou d'utiliser un script lors de l'éloignement du curseur de souris, pour faire revenir les boutons à leurs places respectives.

Or, j'ai accès à la feuille de style userChrome.css car elle est dans le répertoire Chrome, au reste plus difficilement.

Y a-t-il une solution à laquelle je n'ai pas pensé ?

**
Je crois que j'ai une piste sur pourquoi le bouton "Plein écran" est rejeté alors qu'il ne l'était pas il y a quelques mois. J'ai utilisé des outils de personnalisation de Windows, pour notamment agrandir les polices par défaut. Il se peut bien que ça ait joué sur le zoom, et du coup le bloc constitué par la zone d'adresses, ses deux boutons de navigation, et le bouton de rafraichissement, prend presque toute la largeur de l'écran, il reste à peine la place d'afficher le chevron et le menu.
Du coup, je suis sur une piste pour résoudre mon problème : réduire un peu la largeur de la barre d'adresse en présence de la souris.

Si il y a un moyen de mesurer ce facteur de zoom Windows au moment de l'exécution et d'adapter la largeur en conséquence, ça peut être intéressant. En effet, j'avais aussi agrandi les largeurs des ascenseurs, qui sous Windows 10 sont bien petits, et du coup ça a posé un problème quand j'ai demandé un support au sujet d'une suspicion de piratage : FRST a une zone de saisie somme toute pas si immense que ça, alors avec mes ascenseurs surdimensionnés, je ne voyais rien dedans, car l'ascenseur du bas prenait toute la hauteur de la zone de saisie. Il a fallu vite fait me rappeler avec quels outils j'avais personnalisé ça, pour rétropédaler en urgence.
D'où le risque d'un facteur de zoom variable ...
Dernière modification par Gloops le 29 sept. 2018, 01:06, modifié 3 fois.
Avatar de l’utilisateur
pepersan
Tyrannosaurus Rex
Messages : 3458
Inscription : 31 janv. 2017, 10:57

Re: Barre d'adresse, largeur personnalisée

Message par pepersan »

Salut

pour les boutons, en ajoutant des espaces flexible de menu, personnaliser ?
Firefox 140 Linux Mint 21.3 Virginia base: Ubuntu 22.04 jammy
Pour mettre en [Résolu] éditer le premier message du post, en cliquant sur le crayon, modifier le titre, en y ajoutant [Résolu]
Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

Re: Barre d'adresse, largeur personnalisée

Message par Gloops »

Hélas non, j'ai essayé, je l'ai mis à droite (c'est ce que tu aurais fait aussi je suppose ?) et ça n'a pas empêché les boutons d'être rejetés. Là où ça aurait une chance de marcher c'est si on pouvait mettre les boutons à l'intérieur de l'espace flexible. Bon c'est ce que dans un environnement de développement on appelle un panel. C'est pratique, alors ça donne des habitudes :)

Au fait une extension permettait de créer des barres d'outils supplémentaires. Je ne me rappelle plus laquelle.
Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

Re: Barre d'adresse, largeur personnalisée

Message par Gloops »

Je pense à une chose : si je pouvais rendre les boutons non visibles lorsque je place la souris sur la zone d'adresse, et visibles quand j'enlève la souris, il y a peut-être une chance qu'ils ne soient pas rejetés ?
Pour faire ça je vais m'amuser avec les sélecteurs CSS ...
D'ailleurs ce n'est pas gagné, car il s'agit de jouer sur la visibilité d'un contrôle, en passant la souris sur un autre.
Avatar de l’utilisateur
pepersan
Tyrannosaurus Rex
Messages : 3458
Inscription : 31 janv. 2017, 10:57

Re: Barre d'adresse, largeur personnalisée

Message par pepersan »

je l'ai mis à droite (c'est ce que tu aurais fait aussi je suppose ?)
oui, mais ça aurait réduit la barre, bonne recherche :)
Firefox 140 Linux Mint 21.3 Virginia base: Ubuntu 22.04 jammy
Pour mettre en [Résolu] éditer le premier message du post, en cliquant sur le crayon, modifier le titre, en y ajoutant [Résolu]
Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

Re: Barre d'adresse, largeur personnalisée

Message par Gloops »

(6)
Gloops a écrit : 23 sept. 2018, 13:21 Du coup, je suis sur une piste pour résoudre mon problème : réduire un peu la largeur de la barre d'adresse en présence de la souris.
Effectivement, j'ai mis 800 pixels au lieu de 1000, et je garde 3 boutons.

Voici les questions qui restent ouvertes :
  • création de barres d'outils supplémentaires (dont peut-être une visible en plein écran ?)
  • exécution d'un script lors d'un événement sur l'interface du navigateur
et si on peut exécuter un script, ça peut résoudre la question de mesurer la largeur en pixels de la fenêtre ...

Sinon oui c'est vrai ça : c'est quand je n'ai plus su créer de barres d'outils supplémentaires que j'ai mis plus de boutons sur la barre d'adresse, et que du coup ça devient difficile à gérer.

Du coup, je vais renommer le fil.
Freddy
Iguane
Messages : 538
Inscription : 15 nov. 2009, 11:37

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Freddy »

Bonjour,
Gloops a écrit : 23 sept. 2018, 13:21 Y a-t-il une solution à laquelle je n'ai pas pensé ?
Si j'ai bien compris ton problème, tu aimerai pouvoir voir ton interface de la même façon qu'en mode normal au survol souris.
Et donc au lieu d'utiliser le mode plein écran, avec le css y a moyen de créer le même comportement tout en restant en mode normal, et qui plus est, de faire apparaitre l'interface entière (donc avec toutes ses barres).

J'ai créé ce genre de manip, depuis un trés bon long moment maintenant, simplement pour la barre de menu, car pour certaines occasions ça m'est plus pratique que d'utiliser le bouton Menu (hamburger)
Donc en adaptant le code, voilà ce que ça pourrait donner:

Code : Tout sélectionner

/***==== cacher toute la barre navigation ====***/

#main-window[sizemode=maximized] #navigator-toolbox
{ 
min-height: 1px !important;
max-height: 1px !important; 
transition-duration: 800ms !important;
}

#main-window[sizemode=maximized] #navigator-toolbox:hover
{ 
max-height: 94px !important;
transition-duration: 300ms !important;
}
Là j'ai fais l'essai sur mon poste Linux, mais normalement y a pas plus de problème sous windows.

J'espère t'avoir apporté une solution.
Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Gloops »

Freddy a écrit : 23 sept. 2018, 16:00 Si j'ai bien compris ton problème, tu aimerai pouvoir voir ton interface de la même façon qu'en mode normal au survol souris.
Excuse, je n'ai pas compris ce que tu voulais dire.
Comme tu as vu, j'ai mis un style "#urlbar-container:hover", donc c'est que je veux un affichage différent en passant la souris.

Quand j'ai fait le test j'ai fait une faute de frappe alors je n'ai pas vu tout de suite : #navigator-toolbox, ça englobe la barre de menus, et en fait il n'y a que ça qui change de couleur de fond si c'est ça qu'on modifie, alors ça ressemble un peu à une réponse à une question que je posais, sur affecter un contrôle quand la souris survole un autre. Mais c'est un cas particulier, puisque le contrôle qui change de couleur est survolé aussi, même si ça ne se voit pas.
Freddy
Iguane
Messages : 538
Inscription : 15 nov. 2009, 11:37

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Freddy »

Ce que je veux dire, c'est que vu ce que j'ai compris de ça:
Gloops a écrit : 23 sept. 2018, 13:21 La barre d'adresse joue un rôle stratégique, en ce sens qu'en dehors de la barre des onglets, c'est la seule qui soit visible en plein écran (en y faisant venir la souris). Pour cette raison il y a pas mal de monde, là-dessus, ce qui réduit la largeur visible de la zone d'adresse.
c'est que tu aimerais bien avoir plus de barres (donc toutes les barres) qui apparaissent au survol-souris en mode plein écran.
Et donc je propose une solution pour faire ça, avoir le même comportement qu'en plein écran, c'est à dire que les barres n'apparaissent qu'au survol-souris.
D'où l'idée de ce code qui réduit la hauteur de toute l'interface (les barres d'outils) et lui redonne sa hauteur originale quand on pointe la souris tout en haut. Il faut bien sûr rester en mode "normal" (pas en plein écran) et en fenêtre maximisée... et je viens de tester sous windows7, et apparemment y a un problème d'interprétation de ce code... :-? :roll:
J'ai pas vraiment le temps de voir pourquoi tout de suite, mais doit bien y avoir une manière d'y arriver; j’essaierai de voir ça si toutefois ça t'intéresses, à moins que tu en aies les compétences d'après ce que je vois :wink:
Gloops a écrit : 23 sept. 2018, 16:12 ça englobe la barre de menus, et en fait il n'y a que ça qui change de couleur de fond si c'est ça qu'on modifie, alors ça ressemble un peu à une réponse à une question que je posais, sur affecter un contrôle quand la souris survole un autre. Mais c'est un cas particulier, puisque le contrôle qui change de couleur est survolé aussi, même si ça ne se voit pas.
euuh ben là c'est moi qui n'a pas tout compris :| mais bon c'est p'têt dû à l'action du code sur ton poste windows.
Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Gloops »

Freddy a écrit : 24 sept. 2018, 19:59 c'est que tu aimerais bien avoir plus de barres (donc toutes les barres) qui apparaissent au survol-souris en mode plein écran.
Hum, non, si on met trop de barres d'outils en plein écran, ce n'est plus vraiment du plein écran.
Un temps il y en avait une spécifique au plein écran, et comme il y a la barre de navigation on a dû se dire que ce n'était plus la peine. Faut voir.
Je vois bien qu'il va falloir que j'essaie d'être plus clair, puisque tu essaies de formuler à ma place c'est que ça doit coincer un peu.
Il y a deux raisons antagoniques qui font que la barre de navigation (avec la zone d'adresse) tient une grande importance :
  • Des barres d'outils, il n'y en a pas tant que ça, donc on se retrouve à y mettre tous les boutons qu'on aimerait bien avoir sous la main
  • Comme elle est visible en plein écran, il serait intéressant de n'y mettre au contraire que ce qui est utile en plein écran
J'espère que ça sera plus clair comme ça.
Et donc je propose une solution pour faire ça, avoir le même comportement qu'en plein écran, c'est à dire que les barres n'apparaissent qu'au survol-souris.
Sur ce principe-là on a les menus déroulants ;)
Mais c'est vrai qu'à un moment on avait une barre d'outils qu'on faisait apparaître ou disparaître en cliquant sur un bouton, que donc il était préférable de mettre sur une autre barre d'outils.
On a fait disparaître plein de trucs pour privilégier la rapidité, et c'est vrai que ça a marché.
Mais ... De tout ça, peut-être qu'il en reste ?
D'où l'idée de ce code qui réduit la hauteur de toute l'interface (les barres d'outils) et lui redonne sa hauteur originale quand on pointe la souris tout en haut. Il faut bien sûr rester en mode "normal" (pas en plein écran) et en fenêtre maximisée... et je viens de tester sous windows7, et apparemment y a un problème d'interprétation de ce code... :-? :roll:
C'est vrai que jouer sur une partie de l'interface en cliquant (ou faisant passer la souris) sur une autre, ça ouvre des perspectives. Sauf si je ne me trompe, il faut un script, pour ça, enfin en tout cas purement en feuilles de style je ne vois pas ça facilement.
J'ai pas vraiment le temps de voir pourquoi tout de suite, mais doit bien y avoir une manière d'y arriver; j’essaierai de voir ça si toutefois ça t'intéresses, à moins que tu en aies les compétences d'après ce que je vois :wink:
Un temps j'avais vu qu'une macro pouvait lancer un script sur certains événements de navigation. Si ça existe encore, ça pourrait bien être la piste à creuser.
Gloops a écrit : 23 sept. 2018, 16:12 ça englobe la barre de menus, et en fait il n'y a que ça qui change de couleur de fond si c'est ça qu'on modifie, alors ça ressemble un peu à une réponse à une question que je posais, sur affecter un contrôle quand la souris survole un autre. Mais c'est un cas particulier, puisque le contrôle qui change de couleur est survolé aussi, même si ça ne se voit pas.
euuh ben là c'est moi qui n'a pas tout compris :| mais bon c'est p'têt dû à l'action du code sur ton poste windows.
Ah là, il faudra que je mette des copies d'écran :)
Pas ce soir.
Bon en bref, quand même : quand je passe la souris sur la barre de navigation (avec la zone d'adresse), ma barre de menus apparaît avec un fond jaune. Quand je redescends le curseur sur la page web, plus de fond jaune là-haut.

Il m'a semblé que tu cherchais deux sélecteurs CSS, alors respectivement en plein écran, et en fenêtre maximisée :

Code : Tout sélectionner

window[inFullscreen="true"]
#main-window[sizemode="maximized"]
Freddy
Iguane
Messages : 538
Inscription : 15 nov. 2009, 11:37

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Freddy »

Bon alors je vais revenir sur ta demande initiale, qui est d'agrandir la barre d'adresse au survol souris, mais ce qui m'induit peut-être dans la confusion, c'est le mode d'affichage que tu veux utiliser (ou que tu utilises):
:arrow: parce que ton code (dans ton premier message) est spécifié pour le mode "fenêtre maximisé".
Je ne l'avais même pas essayé :oops: mais effectivement il fonctionne seulement pour ce mode d'affichage.
:arrow: or, d'après ce que tu décris
Gloops a écrit : 23 sept. 2018, 13:21 La barre d'adresse joue un rôle stratégique, en ce sens qu'en dehors de la barre des onglets, c'est la seule qui soit visible en plein écran (en y faisant venir la souris).
il s'agit donc bien du comportement du mode plein écran (accès par le bouton dans la barre d'outils ou par la touche F11), on est bien d'accord ?

Dans ce cas le code serait plutôt:

Code : Tout sélectionner

 /*largeur minimum de la barre d'adresse*/
#main-window[inFullscreen] #urlbar-container {
   min-width: 480px !important;
}   

#main-window[inFullscreen] #urlbar-container:hover {
   min-width: 1000px !important;
}   
Ensuite pour résoudre le problème de disparition des boutons après le survol-souris, il faut ajouter cette précision

Code : Tout sélectionner

#main-window[inFullscreen] #nav-bar-customization-target:hover {
  overflow: initial !important;
}
Ce qui donne au final

Code : Tout sélectionner

 /*largeur minimum de la barre d'adresse*/
#main-window[inFullscreen] #urlbar-container {
   min-width: 480px !important;
}   

#main-window[inFullscreen] #urlbar-container:hover {
   min-width: 1000px !important;
}   

#main-window[inFullscreen] #nav-bar-customization-target:hover {
  overflow: initial !important;
}
Chez moi c’est ok aussi bien sur Linux que windows.
Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Gloops »

Non, comme tu as vu, en plein écran on a déjà au besoin regardé l'URL, on a agrandi la page pour pouvoir la lire.
C'est juste en maximisé que je prévois la possibilité de laisser de la place aux boutons, puis d'agrandir la zone d'adresse. Et ça marche bien.
C'est juste que les boutons se barrent, et j'aimerais bien qu'ils reviennent.
Quand on étend sa serviette sur la plage ça fait fuir les oiseaux, ça tombe bien il faut un peu de place. Mais après ils peuvent revenir ;)
Freddy
Iguane
Messages : 538
Inscription : 15 nov. 2009, 11:37

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Freddy »

Dans ce cas il suffit de remplacer [inFullscreen] par [sizemode="maximized"]

Code : Tout sélectionner

 /*largeur minimum de la barre d'adresse*/
#main-window[sizemode="maximized"] #urlbar-container {
   min-width: 480px !important;
}   

#main-window[sizemode="maximized"] #urlbar-container:hover {
   min-width: 1000px !important;
}   

#main-window[sizemode="maximized"] #nav-bar-customization-target:hover {
  overflow: initial !important;
}
Gloops
Tyrannosaurus Rex
Messages : 3813
Inscription : 22 mai 2006, 11:55

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Gloops »

Freddy a écrit : 26 sept. 2018, 17:05 Dans ce cas il suffit de remplacer [inFullscreen] par [sizemode="maximized"]
Et ça va faire revenir les boutons ?
Faudra que tu m'expliques ...
Freddy
Iguane
Messages : 538
Inscription : 15 nov. 2009, 11:37

Re: Barres d'outils supplémentaires ? [anciennement : Barre d'adresse, largeur personnalisée]

Message par Freddy »

Vois par toi-même. C'est pas le cas chez toi ?

Je suis parti du constat que apparemment le problème est dû à la façon dont est géré le dépassement de la box (ici "nav-bar-customization-target"), par défaut il est en overflow: hidden, donc comme au survol on utilise une bonne parti de l'emplacement permis, tout ce qui déborde est caché.
Du coup je me suis dit que si pendant le hover je lui donne une autre valeur, ça pouvait ptêt résoudre le problème.
Bon c'est vrai que le choix de la valeur "visible" est ptêt plus approprié, apparemment les deux fonctionnent.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 3 invités