web-dev-qa-db-fra.com

Quel est le fond translucide d'une boîte de dialogue modale?

De nos jours, il est courant que les boîtes de dialogue modales réduisent également la luminosité du contenu d'arrière-plan, pour qu'il soit clair qu'il ne peut pas interagir avec. Ceci est particulièrement courant sur le Web.

Quel est le nom de l'assombrissement derrière le modal?

Example of a modal dialog

Comme je n'ai jamais connu le nom standard, j'ai eu recours à un nom un peu idiot: sneezeguard.

10
aaaidan

Il est appelé "toile de fond modale "

dans Bootstrap sur Modal/Options

9
Garik

C'est ce qu'on appelle un effet lightbox. Il peut également être appelé "flou", car dans, le modal est maintenant au point et la fenêtre derrière est désactivée.

https://uxplanet.org/best-practices-for-modals-overlays-dialog-windows-c00c66cddd8c

6
Refe

Le fond derrière le modal est flou et assombri pour un effet 3D pour obtenir plus de contraste visuel et faire reculer le fond visuellement.

Un bon mot pour la couche sombre et transparente sur l'arrière-plan flou est canevas. Scrim est quelque chose utilisé pour couvrir physiquement les lumières de la photographie et des tournages de films - pour obtenir des effets d'éclairage.

Voici le canevas Word utilisé dans les directives de conception de matériaux.

Les utilisateurs doivent pouvoir appuyer ou cliquer sur la couverture d'arrière-plan ou sur le canevas pour fermer tout ce qui est ouvert au premier plan. Comme s'ils tapaient sur l'arrière-plan pour l'ouvrir.

3
moot

Les consignes de conception de matériaux Google l'appellent Scrim: https://material.io/design/environment/surfaces.html#attributes

Scrim

Les rayures sont des traitements temporaires qui peuvent être appliqués aux surfaces du matériau dans le but de rendre le contenu sur une surface moins saillant. Ils aident à attirer l'attention de l'utilisateur sur d'autres parties de l'écran, loin de la surface recevant un canevas.

Les gommages peuvent être appliqués de différentes manières, notamment:

  • Assombrir ou éclaircir la surface et son contenu
  • Réduire l'opacité de la surface et de son contenu

Plusieurs surfaces sur un écran à la fois peuvent afficher des canevas. Les rayures peuvent apparaître à n'importe quelle élévation, que ce soit au premier plan ou en arrière-plan.

2
Aline

Au cours des dernières années, le terme que j'ai toujours trouvé dans les cadres pour le fond transparent d'un modal/dialogue/pop-up est superposition .

Voir: Considérations pour styliser un modal .

Gérer la superposition Un modal est souvent accompagné d'une superposition couvrant tout l'écran. Ceci est utile pour un certain nombre de raisons :

  • Il peut assombrir (ou autrement rendre muet) le reste de l'écran, imposant le but "vous devez y faire face avant de quitter" d'un modal.
  • Il peut être utilisé pour empêcher les clics/interactions sur des éléments en dehors du modal.
  • Il peut être utilisé comme un bouton de fermeture géant. Ou "annuler" ou quelle que soit l'action la plus anodine.

Dans la conception matérielle est utilisé le terme toile de fond .

enter image description here

2
Madalina Taina