From 6772831200d14c2436aea2d0c837f40dbf12156f Mon Sep 17 00:00:00 2001 From: SphinxKnight Date: Sun, 26 Sep 2021 13:11:47 +0200 Subject: Prepare Web API section for Markdown conversion (#2464) * Remove summary classes and ids * Remove unecessary hidden * Remove useless span filled with useless attributes / ids * Remove useless font * Remove notranslate * Remove id in other elements than headings * Remove name attributes * Remove 
 for JS w/ language-js class

* Remove 
 for HTML w/ language-html class

* Remove 
 for other lang w/ language-* class

* Rm highlighted line in code samples

* fix links, internal, external, absolute URLs

* missing file from last commit

* Fix styles errors apart from table + some classes

* Fix notes and warnings (+ some other :x)

* fix typo during merge which broke a doc

* aand forgot a conflict

* fix remaining classes of errors except dls and images

* Fix dls

* Fix images (deki/mozillademos) and remaining style issues

* Remove script tag from svg file

* Remove script tag from svg fileS

* Compress SVG files for CI
---
 files/fr/web/api/keyboardevent/key/index.html | 150 ++++++++++++--------------
 1 file changed, 71 insertions(+), 79 deletions(-)

(limited to 'files/fr/web/api/keyboardevent/key/index.html')

diff --git a/files/fr/web/api/keyboardevent/key/index.html b/files/fr/web/api/keyboardevent/key/index.html
index cf51e90dc4..bfd9846960 100644
--- a/files/fr/web/api/keyboardevent/key/index.html
+++ b/files/fr/web/api/keyboardevent/key/index.html
@@ -15,11 +15,9 @@ translation_of: Web/API/KeyboardEvent/key
 
 
La propriété en lecture seule de key de l'interface {{domxref("KeyboardEvent")}} retourne la valeur d’une ou plusieurs touches pressées par l’utilisateur, tout en tenant compte de l'état des touches de modification telles que la touche Shift (majuscules) ainsi que les paramètres régionaux des clavier et mise en page. Ce peut être l’une des valeurs suivantes :

 
-

 
Valeurs des touches

 
-
Voir une liste complète des valeurs de touches

-

+
Voir une liste complète des valeurs de touches

 
 
    
  
  • 
@@ -56,83 +54,83 @@ translation_of: Web/API/KeyboardEvent/key
 
 
    HTML
    
 
-
    <div class="fx">
-  <div>
-    <textarea rows="5" name="test-target" id="test-target"></textarea>
-    <button type="button" name="btn-clear-console" id="btn-clear-console">clear console</button>
-  </div>
-  <div class="flex">
-    <div id="console-log"></div>
-  </div>
-</div>
    
+
    <div class="fx">
+  <div>
+    <textarea rows="5" name="test-target" id="test-target"></textarea>
+    <button type="button" name="btn-clear-console" id="btn-clear-console">clear console</button>
+  </div>
+  <div class="flex">
+    <div id="console-log"></div>
+  </div>
+</div>
    
 
 
    CSS
    
 
-
    .fx {
-  -webkit-display: flex;
-  display: flex;
-  margin-left: -20px;
-  margin-right: -20px;
-}
-
-.fx > div {
-  padding-left: 20px;
-  padding-right: 20px;
-}
-
-.fx > div:first-child {
-   width: 30%;
-}
-
-.flex {
-  -webkit-flex: 1;
-  flex: 1;
-}
-
-#test-target {
-  display: block;
-  width: 100%;
-  margin-bottom: 10px;
-}
    
+
    .fx {
+  -webkit-display: flex;
+  display: flex;
+  margin-left: -20px;
+  margin-right: -20px;
+}
+
+.fx > div {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+
+.fx > div:first-child {
+   width: 30%;
+}
+
+.flex {
+  -webkit-flex: 1;
+  flex: 1;
+}
+
+#test-target {
+  display: block;
+  width: 100%;
+  margin-bottom: 10px;
+}
    
 
 
    JavaScript
    
 
-
    let textarea = document.getElementById('test-target'),
-consoleLog = document.getElementById('console-log'),
-btnClearConsole = document.getElementById('btn-clear-console');
+
    let textarea = document.getElementById('test-target'),
+consoleLog = document.getElementById('console-log'),
+btnClearConsole = document.getElementById('btn-clear-console');
 
-function logMessage(message) {
-  let p = document.createElement('p');
-  p.appendChild(document.createTextNode(message));
-  consoleLog.appendChild(p);
-}
+function logMessage(message) {
+  let p = document.createElement('p');
+  p.appendChild(document.createTextNode(message));
+  consoleLog.appendChild(p);
+}
 
-textarea.addEventListener('keydown', (e) => {
-  if (!e.repeat)
-    logMessage(`first keydown event. key property value is "${e.key}"`);
+textarea.addEventListener('keydown', (e) => {
+  if (!e.repeat)
+    logMessage(`first keydown event. key property value is "${e.key}"`);
   else
-    logMessage(`keydown event repeats. key property value is "${e.key}"`);
-});
-
-textarea.addEventListener('beforeinput', (e) => {
-  logMessage(`beforeinput event. you are about inputing "${e.data}"`);
-});
-
-textarea.addEventListener('input', (e) => {
-  logMessage(`input event. you have just inputed "${e.data}"`);
-});
-
-textarea.addEventListener('keyup', (e) => {
-  logMessage(`keyup event. key property value is "${e.key}"`);
-});
-
-btnClearConsole.addEventListener('click', (e) => {
-  let child = consoleLog.firstChild;
-  while (child) {
-   consoleLog.removeChild(child);
-   child = consoleLog.firstChild;
-  }
-});
    
+    logMessage(`keydown event repeats. key property value is "${e.key}"`);
+});
+
+textarea.addEventListener('beforeinput', (e) => {
+  logMessage(`beforeinput event. you are about inputing "${e.data}"`);
+});
+
+textarea.addEventListener('input', (e) => {
+  logMessage(`input event. you have just inputed "${e.data}"`);
+});
+
+textarea.addEventListener('keyup', (e) => {
+  logMessage(`keyup event. key property value is "${e.key}"`);
+});
+
+btnClearConsole.addEventListener('click', (e) => {
+  let child = consoleLog.firstChild;
+  while (child) {
+   consoleLog.removeChild(child);
+   child = consoleLog.firstChild;
+  }
+});
    
 
 
    Résultat
    
 
@@ -164,7 +162,7 @@ btnClearConsole.Exemple
 
-
    Cet exemple utilise {{domxref("EventTarget.addEventListener()")}} pour écouter les événements  {{domxref("Element/keydown_event", "keydown")}} . Quand ils se produisent, la valeur de la touche est vérifiée pour voir si c'est l'une des touches qui intéressent le code, et si c'est le cas, elle est traitée (éventuellement en pilotant un vaisseau spatial, peut-être en changeant la cellule sélectionnée dans une feuille de calcul).
    
+
    Cet exemple utilise {{domxref("EventTarget.addEventListener()")}} pour écouter les événements  {{domxref("Element/keydown_event", "keydown")}} . Quand ils se produisent, la valeur de la touche est vérifiée pour voir si c'est l'une des touches qui intéressent le code, et si c'est le cas, elle est traitée (éventuellement en pilotant un vaisseau spatial, peut-être en changeant la cellule sélectionnée dans une feuille de calcul).
    
 
 
    window.addEventListener("keydown", function (event) {
   if (event.defaultPrevented) {
@@ -218,10 +216,4 @@ btnClearConsole.Compatibilité des navigateurs
 
-
-
-
    {{Compat("api.KeyboardEvent.key")}}
    
-
-
    
-
-
    
+
    {{Compat("api.KeyboardEvent.key")}}
    
\ No newline at end of file
-- 
cgit v1.2.3-54-g00ecf