From 149319bb8c7b1394a443f0877c3460cd362aa815 Mon Sep 17 00:00:00 2001 From: julieng Date: Fri, 17 Sep 2021 20:58:15 +0200 Subject: move *.html to *.md --- .../css/@media/prefers-reduced-motion/index.html | 140 --------------------- .../web/css/@media/prefers-reduced-motion/index.md | 140 +++++++++++++++++++++ 2 files changed, 140 insertions(+), 140 deletions(-) delete mode 100644 files/fr/web/css/@media/prefers-reduced-motion/index.html create mode 100644 files/fr/web/css/@media/prefers-reduced-motion/index.md (limited to 'files/fr/web/css/@media/prefers-reduced-motion') diff --git a/files/fr/web/css/@media/prefers-reduced-motion/index.html b/files/fr/web/css/@media/prefers-reduced-motion/index.html deleted file mode 100644 index daf259477f..0000000000 --- a/files/fr/web/css/@media/prefers-reduced-motion/index.html +++ /dev/null @@ -1,140 +0,0 @@ ---- -title: prefers-reduced-motion -slug: Web/CSS/@media/prefers-reduced-motion -tags: - - '@media' - - Accessibility - - CSS - - Media Queries - - Reference - - media feature -translation_of: Web/CSS/@media/prefers-reduced-motion ---- -
{{CSSRef}}
- -

La requêtes média CSS prefers-reduced-motion détecte si l'utilisateur a demandé au système de minimiser la quantité d'animation ou de mouvement.

- -
-

Attention : Un exemple intégré au bas de cette page comporte un mouvement d'échelle qui peut poser problème à certains lecteurs. Les lecteurs souffrant de troubles du mouvement vestibulaire peuvent souhaiter activer la fonction de réduction du mouvement sur leur appareil avant de visionner l'animation.

-
- -

Syntaxe

- -
-
no-preference
-
Cette valeur indique que l'utilisateur n'a rien indiqué au système.
-
reduce
-
Cette valeur indique que l'utilisateur souhaite utiliser une interface qui minimise la quantité d'animation, au point où tout mouvement qui n'est pas essentiel a été retiré.
-
- -

Gestion des préférences

- -

Dans Firefox, la valeur reduce est utilisée par le moteur selon des conditions provenant du système d'exploitation/environnement de bureau :

- - - -

Exemple

- -

Cet exemple possède une animation désagréable qui sera exécutée à moins d'activer la réduction de mouvement dans les préférences relatives à l'accessibilité.

- -

HTML

- -
<div class="animation">boîte animée</div>
-
- -

CSS

- -
.animation {
-  animation: vibrate 0.3s linear infinite both;
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .animation {
-  animation: none;
-  }
-}
-
- - - -

Résultat

- -

{{EmbedLiveSample("example")}}

- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('CSS5 Media Queries', '#descdef-media-prefers-reduced-motion', 'prefers-reduced-motion')}}{{Spec2('CSS5 Media Queries')}}Définition initiale.
- -

Compatibilité des navigateurs

- -

{{Compat("css.at-rules.media.prefers-reduced-motion")}}

- -

Voir aussi

- - diff --git a/files/fr/web/css/@media/prefers-reduced-motion/index.md b/files/fr/web/css/@media/prefers-reduced-motion/index.md new file mode 100644 index 0000000000..daf259477f --- /dev/null +++ b/files/fr/web/css/@media/prefers-reduced-motion/index.md @@ -0,0 +1,140 @@ +--- +title: prefers-reduced-motion +slug: Web/CSS/@media/prefers-reduced-motion +tags: + - '@media' + - Accessibility + - CSS + - Media Queries + - Reference + - media feature +translation_of: Web/CSS/@media/prefers-reduced-motion +--- +
{{CSSRef}}
+ +

La requêtes média CSS prefers-reduced-motion détecte si l'utilisateur a demandé au système de minimiser la quantité d'animation ou de mouvement.

+ +
+

Attention : Un exemple intégré au bas de cette page comporte un mouvement d'échelle qui peut poser problème à certains lecteurs. Les lecteurs souffrant de troubles du mouvement vestibulaire peuvent souhaiter activer la fonction de réduction du mouvement sur leur appareil avant de visionner l'animation.

+
+ +

Syntaxe

+ +
+
no-preference
+
Cette valeur indique que l'utilisateur n'a rien indiqué au système.
+
reduce
+
Cette valeur indique que l'utilisateur souhaite utiliser une interface qui minimise la quantité d'animation, au point où tout mouvement qui n'est pas essentiel a été retiré.
+
+ +

Gestion des préférences

+ +

Dans Firefox, la valeur reduce est utilisée par le moteur selon des conditions provenant du système d'exploitation/environnement de bureau :

+ + + +

Exemple

+ +

Cet exemple possède une animation désagréable qui sera exécutée à moins d'activer la réduction de mouvement dans les préférences relatives à l'accessibilité.

+ +

HTML

+ +
<div class="animation">boîte animée</div>
+
+ +

CSS

+ +
.animation {
+  animation: vibrate 0.3s linear infinite both;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .animation {
+  animation: none;
+  }
+}
+
+ + + +

Résultat

+ +

{{EmbedLiveSample("example")}}

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('CSS5 Media Queries', '#descdef-media-prefers-reduced-motion', 'prefers-reduced-motion')}}{{Spec2('CSS5 Media Queries')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

{{Compat("css.at-rules.media.prefers-reduced-motion")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf