diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/fr/web/api/window | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/fr/web/api/window')
97 files changed, 8511 insertions, 0 deletions
diff --git a/files/fr/web/api/window/alert/index.html b/files/fr/web/api/window/alert/index.html new file mode 100644 index 0000000000..cacd0d33db --- /dev/null +++ b/files/fr/web/api/window/alert/index.html @@ -0,0 +1,37 @@ +--- +title: window.alert +slug: Web/API/Window/alert +tags: + - DOM + - DOM_0 + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/alert +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Affiche un dialogue d'alerte contenant le texte spécifié.</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre class="eval">window.alert(<i>message</i>); +</pre> +<ul> + <li><code>message</code> est une chaîne contenant le texte à afficher dans le dialogue d'alerte.</li> +</ul> +<h3 id="Exemple" name="Exemple">Exemple</h3> +<pre class="eval">window.alert("Bonjour !"); +</pre> +<p>produira :</p> +<p><img alt="Image:AlertHelloWorld.png"></p> +<h3 id="Notes" name="Notes">Notes</h3> +<p>Le dialogue d'alerte doit être utilisé pour les messages qui ne demandent aucune réponse de la part de l'utilisateur, à part son acceptation du message.</p> +<p><span class="comment">Le texte suivant est commun à cet article, DOM:window.prompt et DOM:window.confirm</span> Les boîtes de dialogue sont des fenêtres modales : elles empêchent l'utilisateur d'accéder au reste de l'interface du programme tant qu'elles ne sont pas fermées. C'est pourquoi il ne faut pas abuser des fonctions créant une boîte de dialogue (ou fenêtre modale).</p> +<p>Les applications utilisant le chrome (par exemple les extensions) devront plutôt utiliser les méthodes de <a href="fr/NsIPromptService">nsIPromptService</a>.</p> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>{{ DOM0() }}</p> +<h3 id="Voir_aussi" name="Voir_aussi">Voir aussi</h3> +<ul> + <li><a href="/fr/DOM/window.confirm" title="Affiche un dialogue modal avec un message et deux boutons, OK et Annuler.">confirm</a></li> + <li><a href="/fr/DOM/window.prompt" title="Affiche un dialogue avec un message demandant à l'utilisateur d'entrer une réponse sous forme de texte.">prompt</a></li> +</ul> +<div class="noinclude"> + </div> +<p>{{ languages( { "en": "en/DOM/window.alert", "ja": "ja/DOM/window.alert", "pl": "pl/DOM/window.alert" } ) }}</p> diff --git a/files/fr/web/api/window/applicationcache/index.html b/files/fr/web/api/window/applicationcache/index.html new file mode 100644 index 0000000000..1999a31f7f --- /dev/null +++ b/files/fr/web/api/window/applicationcache/index.html @@ -0,0 +1,37 @@ +--- +title: Window.applicationCache +slug: Web/API/Window/applicationCache +translation_of: Web/API/Window/applicationCache +--- +<div class="blockIndicator warning"> +<p><strong>Important</strong>: Le cache d'application est obsolète depuis Firefox 44, et n'est plus disponible dans un contexte non sécurisé depuis Firefox 60 ({{bug(1354175)}}, actuellemet Nightly/Beta seulement). Ne pas l'utiliser sur des sites hors lignes — envisager l'utilisation de <a href="https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API">service workers</a> à la place.</p> +</div> + +<p>{{APIRef}}</p> + +<h2 id="Summary" name="Summary">Sommaire</h2> + +<p>Retourne une référence à l'objet du cache d'application pour la fenêtre.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><var>cache</var> = window.applicationCache +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<ul> + <li><code>cache</code> est une référence objet pour un {{domxref("OfflineResourceList")}}.</li> +</ul> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<ul> + <li>{{spec("http://www.w3.org/TR/2008/WD-html5-20080122/#appcache","HTML 5","WD")}}</li> +</ul> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/en-US/docs/HTML/Using_the_application_cache">Using Application Cache</a></li> +</ul> diff --git a/files/fr/web/api/window/back/index.html b/files/fr/web/api/window/back/index.html new file mode 100644 index 0000000000..653d5b9d61 --- /dev/null +++ b/files/fr/web/api/window/back/index.html @@ -0,0 +1,59 @@ +--- +title: Window.back() +slug: Web/API/Window/back +tags: + - API + - Firefox + - Gecko + - HTML DOM + - Méthode + - Non-standard + - Obsolete + - Window + - back +translation_of: Web/API/Window/back +--- +<div>{{APIRef}}{{ Non-standard_header() }}{{deprecated_header}}</div> + +<p>La méthode obsolète et non standard <code>back()</code> sur l'objet {{domxref("window")}} renvoie la fenêtre à l'élément précédent de l'historique. Il s'agissait d'une méthode spécifique à Firefox et a été supprimée dans Firefox 31.</p> + +<div class="blockIndicator note"> +<p><strong>Note:</strong> Utilisez plutôt la méthode standard {{domxref("history.back")}}.</p> +</div> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox notranslate">window.back();</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<p>Aucun.</p> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p><code>undefined</code>.</p> + +<h2 id="Exemple">Exemple</h2> + +<p>Cet exemple simple gère un clic sur un bouton "Retour" en rappelant <code>back()</code>.</p> + +<pre class="brush:js notranslate">function boutonRetour() { + if (peutRevenirEnArriere) { + window.back(); + } +}</pre> + +<h2 id="Spécification">Spécification</h2> + +<p>Cela ne fait partie d'aucune spécification.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>Cette méthode non standard n'a été implémentée que dans Firefox et a été supprimée dans Firefox 31.</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("History.back()")}}</li> + <li>{{domxref("History.forward()")}}</li> +</ul> diff --git a/files/fr/web/api/window/blur/index.html b/files/fr/web/api/window/blur/index.html new file mode 100644 index 0000000000..ecfd8ee20b --- /dev/null +++ b/files/fr/web/api/window/blur/index.html @@ -0,0 +1,48 @@ +--- +title: Window.blur() +slug: Web/API/Window/blur +tags: + - API + - DOM + - Gecko + - Méthode +translation_of: Web/API/Window/blur +--- +<p>{{APIRef}}</p> + +<p>Éloigne la mise au point de la fenêtre.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><code>window.blur()</code></pre> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush:js notranslate">window.blur();</pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>La méthode window.blur () est l'équivalent programmatique du déplacement du focus de l'utilisateur loin de la fenêtre courante.</p> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="spectable standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentair</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG','interaction.html#dom-window-blur','Window.blur()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.blur")}}</p> diff --git a/files/fr/web/api/window/cancelanimationframe/index.html b/files/fr/web/api/window/cancelanimationframe/index.html new file mode 100644 index 0000000000..53e22003a2 --- /dev/null +++ b/files/fr/web/api/window/cancelanimationframe/index.html @@ -0,0 +1,79 @@ +--- +title: window.cancelAnimationFrame() +slug: Web/API/Window/cancelAnimationFrame +tags: + - API + - Animation + - DOM + - Experimental + - Méthode + - Reference + - Window +translation_of: Web/API/Window/cancelAnimationFrame +--- +<div>{{APIRef}}</div> + +<div>La méthode <code><strong>window.cancelAnimationFrame()</strong></code> met fin à une animation précédement configurée par un appel à {{domxref("window.requestAnimationFrame()")}}.</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox" id="window.cancelAnimationFramerequestID_Paramètres">window.cancelAnimationFrame(<em>requestID</em>);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>requestID</code></dt> + <dd>L'identifiant retourné par l'appel à {{domxref("window.requestAnimationFrame()")}} qui a généré la fonction de rappel (callback)</dd> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js">var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || + window.webkitRequestAnimationFrame || window.msRequestAnimationFrame; + +var cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame; + +var start = window.mozAnimationStartTime; // Seulement supporté par Firefox. Les autre navigateurs peuvent utiliser quelque chose comme Date.now().. + +var myReq; // Déclarer la variable globalement avant de lancer l'animation + +function step(timestamp) { + var progress = timestamp - start; + d.style.left = Math.min(progress / 10, 200) + 'px'; + if (progress < 2000) { + // Ne pas oublier de récupérer l'identifiant à chaque appel de la fonction + myReq = requestAnimationFrame(step); + } +} +myReq = requestAnimationFrame(step); +// L'annulation utilise le dernier identifiant +cancelAnimationFrame(myReq); +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{spec("https://www.w3.org/TR/html51/webappapis.html#animation-frames", "Timing control for script-based animations: cancelAnimationFrame", "WD")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div> + +<p>{{Compat("api.Window.cancelAnimationFrame")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("window.mozAnimationStartTime")}}</li> + <li>{{domxref("window.requestAnimationFrame()")}}</li> +</ul> diff --git a/files/fr/web/api/window/cancelidlecallback/index.html b/files/fr/web/api/window/cancelidlecallback/index.html new file mode 100644 index 0000000000..e09d66e88b --- /dev/null +++ b/files/fr/web/api/window/cancelidlecallback/index.html @@ -0,0 +1,94 @@ +--- +title: window.cancelIdleCallback() +slug: Web/API/Window/cancelIdleCallback +translation_of: Web/API/Window/cancelIdleCallback +--- +<div>{{APIRef}}{{SeeCompatTable}}</div> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>La méthode <strong><code>window.cancelIdleCallback()</code></strong> annule une fonction précedemment planifiée via {{domxref("window.requestIdleCallback()")}}.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox">window.cancelIdleCallback(<em>idleCallbackId</em>);</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<dl> + <dt><font face="Consolas, Liberation Mono, Courier, monospace">idleCallbackId</font></dt> + <dd>L'entier long non-signé retourné par {{domxref("window.requestIdleCallback()")}}.</dd> +</dl> + +<h2 id="Specifications" name="Specifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>Spécification</th> + <th>Status</th> + <th>Commentaire</th> + </tr> + <tr> + <td>{{SpecName('Background Tasks')}}</td> + <td>{{Spec2('Background Tasks')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité avec les navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome(47)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Android Webview</th> + <th>Firefox Mobile (Gecko)</th> + <th>Firefox OS</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome(47)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatChrome(47)}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/fr/web/api/window/captureevents/index.html b/files/fr/web/api/window/captureevents/index.html new file mode 100644 index 0000000000..20774b49a8 --- /dev/null +++ b/files/fr/web/api/window/captureevents/index.html @@ -0,0 +1,57 @@ +--- +title: Window.captureEvents() +slug: Web/API/Window/captureEvents +tags: + - API + - Gecko + - HTML DOM + - Méthode + - Non-standard +translation_of: Web/API/Window/captureEvents +--- +<div>{{ ApiRef() }} {{deprecated_header(1.9)}} {{Non-standard_header}}</div> + +<p>La méthode <code><strong>Window.captureEvents()</strong></code> enregistre la fenêtre pour capturer tous les événements du type spécifié.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">window.captureEvents(<em>eventType</em>) +</pre> + +<p><code>eventType</code> est une combinaison des valeurs suivantes: <code>Event.ABORT</code>, <code>Event.BLUR</code>, <code>Event.CLICK</code>, <code>Event.CHANGE</code>, <code>Event.DBLCLICK</code>, <code>Event.DRAGDDROP</code>, <code>Event.ERROR</code>, <code>Event.FOCUS</code>, <code>Event.KEYDOWN</code>, <code>Event.KEYPRESS</code>, <code>Event.KEYUP</code>, <code>Event.LOAD</code>, <code>Event.MOUSEDOWN</code>, <code>Event.MOUSEMOVE</code>, <code>Event.MOUSEOUT</code>, <code>Event.MOUSEOVER</code>, <code>Event.MOUSEUP</code>, <code>Event.MOVE</code>, <code>Event.RESET</code>, <code>Event.RESIZE</code>, <code>Event.SELECT</code>, <code>Event.SUBMIT</code>, <code>Event.UNLOAD</code>.</p> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush:html notranslate"><!DOCTYPE html> +<html lang="fr"> +<head> +<!-- ... --> +<script> +function reg() { + window.captureEvents(Event.CLICK); + window.onclick = page_click; +} + +function page_click() { + alert('événement de clic sur la page détecté!'); +} +</script> +</head> + +<body onload="reg();"> +<p>cliquez n'importe où sur cette page.</p> +</body> +</html> +</pre> + +<h2 id="Notes">Notes</h2> + +<p>Les événements déclenchés dans le DOM par l'activité de l'utilisateur (tels que cliquer sur des boutons ou déplacer le focus loin du document actuel) passent généralement par la <a href="/en-US/docs/Web/API/Window"><code>window</code></a> de haut niveau et les objets de<code> </code><a href="/en-US/docs/Web/API/document"><code>document</code></a> avant d'arriver à l'objet qui a déclenché l'événement.</p> + +<p>Lorsque vous appelez la méthode <code>captureEvents()</code> sur <a href="/en-US/docs/Web/API/Window"><code>window</code></a>, événements du type que vous spécifier (par exemple, <code>Event.CLICK</code>) ne passe plus par les objets "inférieurs" de la hiérarchie. Pour que les événements "bouillonnent" comme ils le font normalement, vous devez appeler<code> </code><a href="/en-US/docs/Web/API/window.releaseEvents"><code>window.releaseEvents()</code></a> ({{deprecated_inline}}) sur la fenêtre pour l'empêcher de piéger les événements.</p> + +<p>Notez que vous pouvez transmettre une liste d'événements à cette méthode en utilisant la syntaxe suivante : <code>window.captureEvents(Event.KEYPRESS | Event.KEYDOWN | Event.KEYUP)</code>.</p> + +<h2 id="Spécification">Spécification</h2> + +<p>Cela ne fait partie d'aucune spécification.</p> diff --git a/files/fr/web/api/window/clearimmediate/index.html b/files/fr/web/api/window/clearimmediate/index.html new file mode 100644 index 0000000000..dca567cf36 --- /dev/null +++ b/files/fr/web/api/window/clearimmediate/index.html @@ -0,0 +1,68 @@ +--- +title: Window.clearImmediate() +slug: Web/API/Window/clearImmediate +tags: + - API + - HTML DOM + - Méthode + - Window +translation_of: Web/API/Window/clearImmediate +--- +<p>{{APIRef("HTML DOM")}}{{Non-standard_header}}</p> + +<p>Cette méthode efface l'action spécifiée par {{DOMxRef("window.setImmediate")}}.</p> + +<div class="blockIndicator note"> +<p>Cette méthode ne devrait pas devenir standard et n'est implémentée que par les versions récentes d'Internet Explorer et de Node.js 0.10+. Il rencontre la résistance à la fois de <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=686201" title="https://bugzilla.mozilla.org/show_bug.cgi?id=686201">Gecko</a> (Firefox) et <a href="http://code.google.com/p/chromium/issues/detail?id=146172" title="http://code.google.com/p/chromium/issues/detail?id=146172">Webkit</a> (Google/Apple).</p> +</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><var>window</var>.clearImmediate( <var>immediateID</var> ) +</pre> + +<p>où immediateID est un ID retourné par {{DOMxRef("window.setImmediate")}}.</p> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js notranslate">let immediateID = setImmediate(() => { + // Exécute du code +} + +document.getElementById("bouton") + .addEventListener(() => { + clearImmediate(immediateID); +}); +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td><a class="external" href="https://w3c.github.io/setImmediate/#si-setImmediate" hreflang="en" lang="en">Efficient Script Yielding<br> + <small lang="en-US">The definition of '<code>setImmediate</code>' in that specification.</small></a></td> + <td><span class="spec-ED">Editor's Draft</span></td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux donées, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.clearImmediate")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{DOMxRef("Window.setImmediate()")}}</li> +</ul> diff --git a/files/fr/web/api/window/close/index.html b/files/fr/web/api/window/close/index.html new file mode 100644 index 0000000000..7ed74d3242 --- /dev/null +++ b/files/fr/web/api/window/close/index.html @@ -0,0 +1,49 @@ +--- +title: window.close +slug: Web/API/Window/close +tags: + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/close +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Ferme la fenêtre référencée.</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre>window.close(); +</pre> +<h3 id="Description" name="Description">Description</h3> +<p>Lorsque cette méthode est appelée, la fenêtre référencée est fermée.</p> +<p>Cette méthode est uniquement autorisée à être appelée pour des fenêtres qui ont été ouvertes par un script à l'aide de la méthode <a href="fr/DOM/window.open">window.open</a>. Si la fenêtre n'a pas été ouverte par un script, l'erreur suivante apparaît dans la console JavaScript : <code>Scripts may not close windows that were not opened by script.</code></p> +<h4 id="Exemples" name="Exemples">Exemples</h4> +<h5 id="Fermeture_d.27une_fen.C3.AAtre_ouverte_avec_window.open.28.29" name="Fermeture_d.27une_fen.C3.AAtre_ouverte_avec_window.open.28.29">Fermeture d'une fenêtre ouverte avec window.open()</h5> +<pre><script type="text/javascript"> +// Variable globale pour stocker une référence vers la fenêtre ouverte +var fenetreOuverte; + +function ouvrirFenetre() +{ + fenetreOuverte = window.open('details.html'); +} +function fermerFenetreOuverte() +{ + fenetreOuverte.close(); +} +</script> +</pre> +<h5 id="Fermeture_de_la_fen.C3.AAtre_courante" name="Fermeture_de_la_fen.C3.AAtre_courante">Fermeture de la fenêtre courante</h5> +<pre><script type="text/javascript"> +function fermerFenetreCourante() +{ + window.close(); +} +</script> +</pre> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>DOM Level 0. <code>window.close()</code> ne fait partie d'aucune spécification ni recommandation technique du W3C.</p> +<h3 id="R.C3.A9f.C3.A9rence_additionnelle" name="R.C3.A9f.C3.A9rence_additionnelle">Référence additionnelle</h3> +<ul> + <li><a class="external" href="http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/methods/close_0.asp">window.close() sur MSDN</a></li> +</ul> +<div class="noinclude"> + </div> +<p>{{ languages( { "en": "en/DOM/window.close", "ja": "ja/DOM/window.close" } ) }}</p> diff --git a/files/fr/web/api/window/closed/index.html b/files/fr/web/api/window/closed/index.html new file mode 100644 index 0000000000..62038b80ae --- /dev/null +++ b/files/fr/web/api/window/closed/index.html @@ -0,0 +1,59 @@ +--- +title: window.closed +slug: Web/API/Window/closed +tags: + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/closed +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Cette propriété indique si la fenêtre référencée est fermée ou non.</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre>isClosed = window.closed; +</pre> +<p>Cette propriété est en lecture seule.</p> +<h3 id="Valeur_renvoy.C3.A9e" name="Valeur_renvoy.C3.A9e">Valeur renvoyée</h3> +<dl> + <dt> + <code>isClosed</code></dt> + <dd> + Un booléen. Les valeurs possibles sont :</dd> +</dl> +<ul> + <li><code>false</code> : La fenêtre est ouverte.</li> + <li><code>true</code> : La fenêtre a été fermée.</li> +</ul> +<h3 id="Exemples" name="Exemples">Exemples</h3> +<h4 id="Chargement_d.27une_page_dans_la_fen.C3.AAtre_principale_depuis_un_popup" name="Chargement_d.27une_page_dans_la_fen.C3.AAtre_principale_depuis_un_popup">Chargement d'une page dans la fenêtre principale depuis un popup</h4> +<p>L'exemple suivant montre comment un popup peut transmettre un choix de l'utilisateur à la fenêtre principale en y ouvrant une URL différente. Mais il faut d'abord vérifier que la fenêtre principale et encore ouverte.</p> +<pre>if (!window.opener.closed) { + // La fenêtre principale est encore là, + // on peut donc y charger une autre page + window.opener.location.href = newURL; +} +</pre> +<h4 id="Appel_d.27une_fonction_dans_un_popup_ouvert_pr.C3.A9c.C3.A9demment" name="Appel_d.27une_fonction_dans_un_popup_ouvert_pr.C3.A9c.C3.A9demment">Appel d'une fonction dans un popup ouvert précédemment</h4> +<p>Dans cette exemple, la fonction <code>refreshPopupWindow()</code> appelle une fonction dans le popup pour rafraichir son contenu. Cependant, si le popup n'a pas encore été ouvert ou si l'utilisateur l'a fermé, un nouveau popup est ouvert.</p> +<pre>var popupWindow = null; + +function refreshPopupWindow() { + if (popupWindow && !popupWindow.closed) { + // Le popup a déjà été ouvert et il l'est encore. + // On peut donc appeler sa fonction doRefresh(). + popupWindow.doRefresh(); + } else { + // Il est nécessaire d'ouvrir d'abord le popup. + popupWindow = window.open("popup.html"); + } +} +</pre> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>DOM Level 0. <code>window.closed</code> ne fait partie d'aucune spécification ou recommandation technique du W3C.</p> +<h3 id="R.C3.A9f.C3.A9rence_suppl.C3.A9mentaire" name="R.C3.A9f.C3.A9rence_suppl.C3.A9mentaire">Référence supplémentaire</h3> +<ul> + <li><a class="external" href="http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/properties/closed.asp">window.closed sur MSDN</a></li> +</ul> +<p> </p> +<div class="noinclude"> + </div> +<p>{{ languages( { "en": "en/DOM/window.closed", "ja": "ja/DOM/window.closed", "pl": "pl/DOM/window.closed" } ) }}</p> diff --git a/files/fr/web/api/window/confirm/index.html b/files/fr/web/api/window/confirm/index.html new file mode 100644 index 0000000000..099cfdaac8 --- /dev/null +++ b/files/fr/web/api/window/confirm/index.html @@ -0,0 +1,51 @@ +--- +title: window.confirm +slug: Web/API/Window/confirm +tags: + - DOM + - DOM_0 +translation_of: Web/API/Window/confirm +--- +<p>{{ApiRef("Window")}}</p> + +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> + +<p>Affiche un dialogue modal avec un message et deux boutons, OK et Annuler.</p> + +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> + +<pre class="eval"><em>resultat</em> = window.confirm(<em>message</em>); +</pre> + +<ul> + <li><code>message</code> est la chaîne contenant le texte à afficher dans le dialogue.</li> + <li><code>resultat</code> est une valeur booléenne indiquant si OK ou Annuler a été sélectionné (<code>true</code> signifie OK).</li> +</ul> + +<h3 id="Exemple" name="Exemple">Exemple</h3> + +<pre class="eval">if (window.confirm("Une nouvelle fenêtre va s'ouvrir.")) { + window.open("fenetre.html", "Nouvelle fenêtre", ""); +} +</pre> + +<h3 id="Notes" name="Notes">Notes</h3> + +<p><span class="comment">Le texte suivant est commun à cet article, DOM:window.prompt et DOM:window.confirm</span> Les boîtes de dialogue sont des fenêtres modales : elles empêchent l'utilisateur d'accéder au reste de l'interface du programme tant qu'elles ne sont pas fermées. C'est pourquoi il ne faut pas abuser des fonctions créant une boîte de dialogue (ou fenêtre modale).</p> + +<p>Les applications utilisant le chrome (par exemple les extensions) devront plutôt utiliser les méthodes de <a href="fr/NsIPromptService">nsIPromptService</a>.</p> + +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> + +<p>{{ DOM0() }}</p> + +<h3 id="Voir_aussi" name="Voir_aussi">Voir aussi</h3> + +<ul> + <li><a href="/fr/docs/DOM/window.alert" title="Affiche un dialogue d'alerte contenant le texte spécifié.">alert</a></li> + <li><a href="/fr/docs/DOM/window.prompt" title="Affiche un dialogue avec un message demandant à l'utilisateur d'entrer une réponse sous forme de texte.">prompt</a></li> +</ul> + +<div class="noinclude"> </div> + +<p>{{ languages( { "en": "en/DOM/window.confirm", "ja": "ja/DOM/window.confirm" } ) }}</p> diff --git a/files/fr/web/api/window/console/index.html b/files/fr/web/api/window/console/index.html new file mode 100644 index 0000000000..6d0bc951dd --- /dev/null +++ b/files/fr/web/api/window/console/index.html @@ -0,0 +1,56 @@ +--- +title: Window.console +slug: Web/API/Window/console +tags: + - API + - Propriété + - Reference + - Window + - console + - lecture seule +translation_of: Web/API/Window/console +--- +<p>{{ APIRef }}</p> + +<p>La propriété <strong><code>Window.console</code></strong> en lecture seule retourne une référence à l'objet {{domxref("Console")}}, qui founit des méthodes pour afficher des information sur la console du navigateur. Ces méthodes ont pour seul but le débogage et ne devraient pas servir à présenter des informations au utilisateurs.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><em>var consoleObj</em> = <em>window</em>.console; +</pre> + +<h2 id="Example" name="Example">Exemples</h2> + +<h3 id="Afficher_dans_la_console">Afficher dans la console</h3> + +<p>Le premier exemple affiche du texte dans la console.</p> + +<pre class="brush: js">console.log("An error occurred while loading the content"); +</pre> + +<p>L'exemple suivant affiche un objet dans la console, et les champs de l'objet y sont écrit:</p> + +<pre class="brush: js">console.dir(someObject);</pre> + +<p>Voir {{SectionOnPage("/en-US/docs/Web/API/Console", "Usage")}} pour plus d'exemples appronfondit.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Status</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('Console API')}}</td> + <td>{{Spec2('Console API')}}</td> + <td>Définition Initiale.</td> + </tr> + </tbody> +</table> + +<div class="note"> +<p>Actuellement il y a beaucoup de différences d'implémentation entre les navigateurs, mais ils sont en train d'être standardisés pour les rendre plus consistants entre eux.</p> +</div> diff --git a/files/fr/web/api/window/content/index.html b/files/fr/web/api/window/content/index.html new file mode 100644 index 0000000000..befde3636a --- /dev/null +++ b/files/fr/web/api/window/content/index.html @@ -0,0 +1,29 @@ +--- +title: window.content +slug: Web/API/Window/content +tags: + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/content +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Renvoie un objet <a href="fr/DOM/window">Window</a> pour la fenêtre de contenu principale. C'est utile pour les fenêtres XUL qui ont un <code><browser></code> (ou <code>tabbrowser</code> ou <code><iframe></code>) avec l'attribut <code>type="content-primary"</code> défini - l'exemple le plus célèbre étant la fenêtre principale de Firefox, <code>browser.xul</code>. Dans de tels cas, <code>content</code> renvoie une référence à l'objet <code>Window</code> pour le document actuellement affiché dans le navigateur. Il s'agit d'un raccourci pour <code><var>browserRef</var>.contentWindow</code>.</p> +<p>Dans du contenu non privilégié (des pages Web), <code>content</code> est normalement équivalent à <a href="fr/DOM/window.top">top</a> (sauf dans le cas d'une page chargée dans un panneau latéral, où <code>content</code> se réfère à l'objet <code>Window</code> de l'onglet sélectionné).</p> +<p>Certains exemples utilisent <code>_content</code> à la place de <code>content</code>. Cette forme est dépréciée depuis un long moment, et vous devriez toujours utiliser <code>content</code> dans du nouveau code.</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre class="eval">var <var>windowObject</var> = window.content; +</pre> +<h3 id="Exemple" name="Exemple">Exemple</h3> +<p>L'exécution du code suivant dans une fenêtre chrome XUL contenant un élement <code><browser type="content-primary"/></code> dessine une bordure rouge autour du premier élément div de la page actuellement affichée dans le navigateur :</p> +<pre class="eval">content.document.getElementsByTagName("div")[0].style.border = "solid red 1px"; +</pre> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>Ne fait partie d'aucune spécification du W3C.</p> +<h3 id="Voir_aussi" name="Voir_aussi">Voir aussi</h3> +<ul> + <li><a href="fr/Travailler_avec_des_fen%c3%aatres_dans_le_chrome">Travailler avec des fenêtres dans le chrome</a></li> + <li>Lorsque vous accédez à des documents depuis du code privilégié, faites attention aux <a href="fr/XPCNativeWrapper">XPCNativeWrapper</a>.</li> +</ul> +<div class="noinclude"> + </div> +<p>{{ languages( { "en": "en/DOM/window.content", "ja": "ja/DOM/window.content", "pl": "pl/DOM/window.content" } ) }}</p> diff --git a/files/fr/web/api/window/controllers/index.html b/files/fr/web/api/window/controllers/index.html new file mode 100644 index 0000000000..1b91ba0937 --- /dev/null +++ b/files/fr/web/api/window/controllers/index.html @@ -0,0 +1,46 @@ +--- +title: Window.controllers +slug: Web/API/Window/controllers +tags: + - API + - HTML DOM + - NeedMarkupWork + - NeedSpecTavle + - NeedsCompatTable + - Property + - Reference + - Window +translation_of: Web/API/Window/controllers +--- +<div>{{APIRef}}{{non-standard_header}}</div> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>Retourne les contrôleurs XUL de la fenêtre chrome.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><var>controleurs</var> = window.controllers +</pre> + +<ul> + <li><code>controleurs</code> est un objet de type <a href="/en-US/docs/XULControllers"><code>XULControllers</code></a> (<a href="/en-US/docs/XPCOM_Interface_Reference/nsIControllers"><code>nsIControllers</code></a>).</li> +</ul> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<p>Spécifique à XUL. Ne fait pas partie de la spécification.</p> + +<div class="note"> +<p>Par défaut, le contrôleur d'une fenêtre contient le code qui prend en charge les commandes globales de la fenêtre.</p> + +<p>Le code Chrome peut ajouter des contrôleurs (à utiliser conjointement avec les fonctions goDoCommand et goUpdateCommand dans globalOverlay.js).</p> + +<p>Cependant, les contrôleurs ajoutés doivent être explicitement supprimés lorsque la fenêtre est déchargée, car cela n'est pas fait automatiquement.<br> + Chaque suppression manquante peut provoquer le</p> +<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=415775">bug 415775</a>: + +<pre class="bz_comment_text" id="comment_text_0">ASSERTION: XPConnect is being called on a scope without a 'Components' property!</pre> +</div> + +<p> </p> diff --git a/files/fr/web/api/window/copy_event/index.html b/files/fr/web/api/window/copy_event/index.html new file mode 100644 index 0000000000..c99af609ed --- /dev/null +++ b/files/fr/web/api/window/copy_event/index.html @@ -0,0 +1,77 @@ +--- +title: 'Window: copy event' +slug: Web/API/Window/copy_event +tags: + - API + - Clippboard API + - Copie + - Event + - Evènement + - Reference + - Window + - copy +translation_of: Web/API/Window/copy_event +--- +<div>{{APIRef}}</div> + +<p><span class="seoSummary">L'événement <strong><code>copy</code></strong> se déclenche lorsque l'utilisateur lance une action de copie via l'interface utilisateur du nagivateur.</span></p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Oui</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Oui</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("ClipboardEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événement</th> + <td>{{domxref("HTMLElement/oncopy", "oncopy")}}</td> + </tr> + </tbody> +</table> + +<p>La cible d'origine de cet événement est le {{domxref ("Element")}} qui était la cible prévue de l'action de copie. Vous pouvez écouter cet événement sur l'interface {{domxref ("Window")}} pour le gérer dans les phases de capture ou de bullage. Pour plus de détails sur cet événement, veuillez consulter la page sur le <a href="/en-US/docs/Web/API/Element/copy_event">Element: copy event</a>.</p> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js notranslate">window.addEventListener('copy', (event) => { + console.log('action de copie lancée') +});</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Clipboard API', '#clipboard-event-copy')}}</td> + <td>{{Spec2('Clipboard API')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.copy_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>Événements liés: {{domxref("Window/cut_event", "cut")}}, {{domxref("Window/paste_event", "paste")}}</li> + <li>Cet événement sur {{domxref("Element")}} cible: {{domxref("Element/copy_event", "copy")}}</li> + <li>Cet événement sur {{domxref("Document")}} cible: {{domxref("Document/copy_event", "copy")}}</li> +</ul> diff --git a/files/fr/web/api/window/crypto/index.html b/files/fr/web/api/window/crypto/index.html new file mode 100644 index 0000000000..dadf4b3518 --- /dev/null +++ b/files/fr/web/api/window/crypto/index.html @@ -0,0 +1,88 @@ +--- +title: Window.crypto +slug: Web/API/Window/crypto +translation_of: Web/API/Window/crypto +--- +<p>{{APIRef}}</p> + +<p>La propriété, en lecture seule, {{domxref("Window.crypto")}} retourne l'objet {{domxref("Crypto")}} associé à l'objet global. Cet objet permet aux pages web d'avoir un accès à certains services liés à cryptographie.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var <em>cryptoObj</em> = window.crypto || window.msCrypto; // pour IE 11 +</pre> + +<h2 id="Specification" name="Specification">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName("Web Crypto API", "#dfn-GlobalCrypto", "Window.crypto")}}</td> + <td>{{Spec2("Web Crypto API")}}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_navigateur">Compatibilité navigateur</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer / Edge</th> + <th>Chrome Opera Vivaldi</th> + <th>Safari</th> + </tr> + <tr> + <td>Support de base</td> + <td>44 {{ CompatVersionUnknown() }}</td> + <td>{{CompatVersionUnknown}}</td> + <td>6 {{ property_prefix("-ms") }}</td> + <td>19</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Chrome for Android</th> + <th>Firefox Gecko Mobile</th> + <th>Firefox OS</th> + <th>Internet Explorer / Edge</th> + <th>Opera for Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Support de base</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>2 {{ CompatVersionUnknown() }}</td> + <td>10 {{ CompatVersionUnknown() }}</td> + <td>37 {{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>L'objet global {{domxref("Window")}}</li> +</ul> diff --git a/files/fr/web/api/window/customelements/index.html b/files/fr/web/api/window/customelements/index.html new file mode 100644 index 0000000000..cc57a29618 --- /dev/null +++ b/files/fr/web/api/window/customelements/index.html @@ -0,0 +1,116 @@ +--- +title: Window.customElements +slug: Web/API/Window/customElements +tags: + - API + - CustomElementRegistry + - Property + - Reference + - Web Components + - Window + - custom elements +translation_of: Web/API/Window/customElements +--- +<div>{{APIRef}}</div> + +<p>La propriété en lecture seule <code>customElements</code> de l'interface {{domxref("Window")}} renvoie une référence à l'objet {{domxref("CustomElementRegistry")}}, qui peut être utilisée pour enregistrer de nouveaux <a href="/fr-FR/docs/Web/Web_Components/Using_custom_elements">éléments personnalisés</a> et obtenir des informations sur des éléments personnalisés enregistrés.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre>let registreElementsPersonnalises = window.customElements;</pre> + +<h3 id="Valeur_retournée">Valeur retournée</h3> + +<p>Une instance d'objet {{domxref("CustomElementRegistry")}} représentant le registre des éléments personnalisés pour la fenêtre en cours.</p> + +<h2 id="Examples" name="Examples">Exemples</h2> + +<p>L'exemple le plus courant d'utilisation de cette propriété que vous verrez sera d'obtenir l'accès à la méthode {{domxref ("CustomElementRegistry.define()")}} pour définir et enregistrer un nouvel élément personnalisé, par exemple :</p> + +<pre>let registreElementsPersonnalises = window.customElements; +registreElementsPersonnalises.define('mon-element-personnalise', MonElementPersonnalise);</pre> + +<p>Cependant, il est généralement raccourci en quelque chose comme :</p> + +<pre>customElements.define('details-element', + class extends HTMLElement { + constructor() { + super(); + const modele = document + .getElementById('modele-details-element') + .content; + const racineOmbre = this.attachShadow({mode: 'open'}) + .appendChild(template.cloneNode(true)); + } +});</pre> + +<p>Voir notre repo <a href="https://github.com/mdn/web-components-examples/">web-components-examples</a> pour davantage d'exemples d'utilisation.</p> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName("HTML WHATWG", "custom-elements.html#dom-window-customelements", "window.customElements")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité des navigateurs</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Firefox (Gecko)</th> + <th>Chrome</th> + <th>Edge</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>window.customElements</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Firefox Mobile (Gecko)</th> + <th>Chrome for Android</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>window.customElements</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/fr/web/api/window/cut_event/index.html b/files/fr/web/api/window/cut_event/index.html new file mode 100644 index 0000000000..422705fc68 --- /dev/null +++ b/files/fr/web/api/window/cut_event/index.html @@ -0,0 +1,76 @@ +--- +title: 'Window: cut event' +slug: Web/API/Window/cut_event +tags: + - API + - API Presse-papiers + - Cut + - Evènement + - Reference + - Web + - Window +translation_of: Web/API/Window/cut_event +--- +<div>{{APIRef}}</div> + +<p><span class="seoSummary">L'événement <strong><code>cut</code></strong> est déclenché lorsque l'utilisateur a lancé une action de "cut" via l'interface utilisateur du navigateur.</span></p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Oui</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Oui</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("ClipboardEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td>{{domxref("HTMLElement/oncut", "oncut")}}</td> + </tr> + </tbody> +</table> + +<p>La cible d'origine de cet événement est le {{domxref("Element")}} qui était la cible prévue de l'action cut. Vous pouvez écouter cet événement sur l'interface {{domxref("Window")}} pour le gérer dans les phases de capture ou de bullage. Pour plus de détails sur cet événement, veuillez consulter la page sur l'événement <a href="/en-US/docs/Web/API/Element/cut_event">Element: cut event</a>.</p> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js notranslate">window.addEventListener('cut', (event) => { + console.log('cut action initiated') +});</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Clipboard API', '#clipboard-event-cut')}}</td> + <td>{{Spec2('Clipboard API')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.cut_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>Événements liés: {{domxref("Window/copy_event", "copy")}}, {{domxref("Window/paste_event", "paste")}}</li> + <li>Cet événement sur {{domxref("Element")}} targets: {{domxref("Element/cut_event", "cut")}}</li> + <li>Cet événement sur {{domxref("Document")}} targets: {{domxref("Document/cut_event", "cut")}}</li> +</ul> diff --git a/files/fr/web/api/window/defaultstatus/index.html b/files/fr/web/api/window/defaultstatus/index.html new file mode 100644 index 0000000000..9a991ac4fb --- /dev/null +++ b/files/fr/web/api/window/defaultstatus/index.html @@ -0,0 +1,52 @@ +--- +title: Window.defaultStatus +slug: Web/API/Window/defaultStatus +tags: + - API + - HTML DOM + - NeedsCompatTable + - NeedsExample + - NeedsMarkupWork + - NeedsSpecTable + - Obsolete + - Propriété + - Reference + - Window +translation_of: Web/API/Window/defaultStatus +--- +<p>{{ obsolete_header(23) }}</p> + +<p>{{ APIRef() }}</p> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>Obtient / définit le texte de la barre d'état pour la fenêtre donnée.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="eval notranslate"><em>var sMsg</em> = window.defaultStatus; +window.defaultStatus = <em>sMsg;</em> +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<ul> + <li><code>sMsg</code> est une chaîne contenant le texte à afficher par défaut dans la barre d'état.</li> +</ul> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="notranslate"><html> + <body onload="window.defaultStatus='salut!';"/> + <button onclick="window.confirm('Êtes-vous sûr de vouloir quitter?');">confirmer</button> + </body> +</html> +</pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>Pour définir le statut une fois la fenêtre ouverte, utilisez {{domxref("window.status")}}.</p> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<p>HTML5</p> diff --git a/files/fr/web/api/window/devicepixelratio/index.html b/files/fr/web/api/window/devicepixelratio/index.html new file mode 100644 index 0000000000..e232a571d3 --- /dev/null +++ b/files/fr/web/api/window/devicepixelratio/index.html @@ -0,0 +1,91 @@ +--- +title: Window.devicePixelRatio +slug: Web/API/Window/devicePixelRatio +translation_of: Web/API/Window/devicePixelRatio +--- +<p>{{APIRef}}</p> + +<p>La propriété en lecture seule <code>Window.devicePixelRatio</code> retourne le rapport entre la taille (verticale) d'un pixel physique sur le périphérique d'affichage et la taille d'un pixel indépendant du matériel (abrégé en anglais "dips").</p> + +<p>Aucun rappel ni événement ne se déclenche lorsque la valeur change (par exemple, si vous glissez la fenêtre entre deux écrans à densités de pixels différentes).</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><em><var>valeur</var></em> = window.devicePixelRatio; +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName("CSSOM View", "#dom-window-devicepixelratio", "Window.devicePixelRatio")}}</td> + <td>{{Spec2("CSSOM View")}}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité des navigateurs</h2> + +<p>{{ CompatibilityTable }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/en-US/docs/Web/CSS/@media/resolution">CSS <code>resolution</code> media query</a></li> + <li>PPK a effectué des <a href="http://www.quirksmode.org/blog/archives/2012/06/devicepixelrati.html">recherches sur devicePixelRatio</a></li> +</ul> diff --git a/files/fr/web/api/window/dialogarguments/index.html b/files/fr/web/api/window/dialogarguments/index.html new file mode 100644 index 0000000000..e79536d5cf --- /dev/null +++ b/files/fr/web/api/window/dialogarguments/index.html @@ -0,0 +1,28 @@ +--- +title: Window.dialogArguments +slug: Web/API/Window/dialogArguments +tags: + - API + - Déprécié + - HTML DOM + - NeedsExample + - NeedsMarkupWork + - NeedsSpecTable + - Property + - Reference + - Window +translation_of: Web/API/Window/dialogArguments +--- +<p>{{ Fx_minversion_header(3) }} {{ deprecated_header() }}{{APIRef}}</p> + +<p><span class="seoSummary">La propriété <code>dialogArguments</code> renvoie les paramètres qui ont été transmis à la méthode {{domxref("window.showModalDialog()")}} method.</span> Cela vous permet de déterminer quels paramètres ont été spécifiés lors de la boîte de dialogue modale.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><var>valeur</var> = window.dialogArguments;</pre> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.dialogArguments")}}</p> diff --git a/files/fr/web/api/window/directories/index.html b/files/fr/web/api/window/directories/index.html new file mode 100644 index 0000000000..a4ea62e3a8 --- /dev/null +++ b/files/fr/web/api/window/directories/index.html @@ -0,0 +1,45 @@ +--- +title: Window.directories +slug: Web/API/Window/directories +tags: + - API + - HTML DOM + - NeedsCompatTable + - NeedsExample + - NeedsMarkupWork + - NeedsSpecTable + - Obsolete + - Propriété + - Reference + - Window +translation_of: Web/API/Window/directories +--- +<p>{{ obsolete_header("2.0") }}</p> + +<p>{{ APIRef() }}</p> + +<h3 id="Summary" name="Summary">Résumé</h3> + +<p>Retourne l'objet de la barre d'outils de la barre personnelle de la fenêtre. Utilisez plutôt {{ domxref("window.personalbar") }}.</p> + +<h3 id="Syntax" name="Syntax">Syntaxe</h3> + +<pre class="javascript notranslate">var <var>dirBar</var> = window.directories; +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<p><var>dirBar</var> est un objet du type <code>BarProp</code>.</p> + +<h3 id="Example" name="Example">Exemple</h3> + +<pre class="notranslate"><script> + function dirs() { + alert(window.directories); + } +</script> +</pre> + +<h3 id="Specification" name="Specification">Spécification</h3> + +<p>Ne fait pas partie des spécifications.</p> diff --git a/files/fr/web/api/window/document/index.html b/files/fr/web/api/window/document/index.html new file mode 100644 index 0000000000..8fb5e6967e --- /dev/null +++ b/files/fr/web/api/window/document/index.html @@ -0,0 +1,47 @@ +--- +title: Window.document +slug: Web/API/Window/document +tags: + - API + - HTML DOM + - Propriété + - Reference + - Window +translation_of: Web/API/Window/document +--- +<div>{{APIRef}}</div> + +<p><span class="seoSummary"><strong><code>window.document</code></strong> renvoie une référence au <a href="/en-US/docs/Web/API/document">document</a> contenu dans la fenêtre.</span></p> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush: js notranslate">console.log(window.document.title); +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécifications</th> + <th scope="col">Statut</th> + <th scope="col">Commentaires</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', '#dom-document-2', 'Window.document')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#dom-document-0', 'Window.document')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.document")}}</p> diff --git a/files/fr/web/api/window/dump/index.html b/files/fr/web/api/window/dump/index.html new file mode 100644 index 0000000000..c1821d4daa --- /dev/null +++ b/files/fr/web/api/window/dump/index.html @@ -0,0 +1,26 @@ +--- +title: window.dump +slug: Web/API/Window/dump +tags: + - DOM + - DOM_0 + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/dump +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Affiche des messages dans la console (native).</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre class="eval">dump(<em>message</em>); +</pre> +<ul> + <li><code>message</code> est le message texte à afficher.</li> +</ul> +<h3 id="Notes" name="Notes">Notes</h3> +<p><code>dump</code> est habituellement utilisé pour débogage du JavaScript. Du code avec permissions peut également utiliser <a href="/fr/Components.utils.reportError" title="fr/Components.utils.reportError">Components.utils.reportError</a> et <a href="/fr/nsIConsoleService" title="fr/nsIConsoleService">nsIConsoleService</a> pour afficher des messages dans la <a href="/fr/Console_JavaScript" title="fr/Console_JavaScript">console JavaScript</a>.</p> +<p>Dans <a href="/fr/Gecko" title="fr/Gecko">Gecko</a>, <code>dump</code> est désactivé par défaut – il ne fait rien mais ne génère aucune erreur. Pour que <code>dump</code> écrive dans le flux standard de sortie, vous devez l'activer en mettant la préférence <code>browser.dom.window.dump.enabled</code> à <code>true</code>. Vous pouvez définir cette préférence dans <a class="external" href="http://kb.mozillazine.org/About:config">about:config</a> ou dans un <a class="external" href="http://kb.mozillazine.org/User.js_file">fichier user.js</a>.</p> +<p>Vous aurez besoin d'une console pour voir quelque chose. Si vous n'en avez pas déjà une, fermez et réouvrez le programme en ajoutant le paramètre <code>-console</code> à la ligne de commande.</p> +<p><code>dump</code> est également disponible au composants XPCOM implémentés en JavaScript, même si <a href="/fr/DOM/window" title="fr/DOM/window">window</a> n'est pas l'objet global dans ce contexte.</p> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>{{ DOM0() }}</p> +<p>{{ languages( { "en": "en/DOM/window.dump", "ja": "ja/DOM/window.dump", "pl": "pl/DOM/window.dump" } ) }}</p> diff --git a/files/fr/web/api/window/event/index.html b/files/fr/web/api/window/event/index.html new file mode 100644 index 0000000000..18344b068c --- /dev/null +++ b/files/fr/web/api/window/event/index.html @@ -0,0 +1,51 @@ +--- +title: Window.event +slug: Web/API/Window/event +tags: + - API + - Evènement + - Gestionnaire d'évènements + - HTML DOM + - Lecture seulement + - Propriété + - Window +translation_of: Web/API/Window/event +--- +<div>{{APIRef("DOM")}}</div> + +<p>L'événement de propriété {{domxref("Window")}} en lecture seule renvoie le {{domxref("Event")}} qui est actuellement géré par le code du site. En dehors du contexte d'un gestionnaire d'événements, la valeur est toujours <code>undefined</code>.</p> + +<p>Vous devez éviter d'utiliser cette propriété dans un nouveau code et utiliser à la place le {{domxref ("Event")}} transmis à la fonction de gestionnaire d'événements. Cette propriété n'est pas prise en charge universellement et même lorsqu'elle est prise en charge, elle introduit une fragilité potentielle dans votre code.</p> + +<div class="note"> +<p><strong>Note:</strong> Cette propriété peut être fragile, dans la mesure où il peut y avoir des situations dans lesquelles <code>l'événement</code> renvoyé n'est pas la valeur attendue. De plus, <code>Window.event</code> n'est pas précis pour les événements distribués dans {{Glossary("shadow tree", "shadow trees")}}.</p> +</div> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('DOM WHATWG', "#dom-window-event", "Window.event")}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_Compatibility" name="Browser_Compatibility">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("Event.srcElement")}}</li> +</ul> diff --git a/files/fr/web/api/window/find/index.html b/files/fr/web/api/window/find/index.html new file mode 100644 index 0000000000..9ce279fc62 --- /dev/null +++ b/files/fr/web/api/window/find/index.html @@ -0,0 +1,78 @@ +--- +title: Window.find() +slug: Web/API/Window/find +tags: + - API + - HTML DOM + - Méthode + - NeedsCompatTable + - NeedsContent + - Non-standard + - Reference + - Window + - find +translation_of: Web/API/Window/find +--- +<div>{{ApiRef}}{{Non-standard_Header}}</div> + +<div class="blockIndicator note"> +<p><strong>Note:</strong> La prise en charge de <code>Window.find()</code> pourrait changer dans les futures versions de Gecko. Voir {{Bug("672395")}}.</p> +</div> + +<p>La méthode <code><strong>Window.find()</strong></code> trouve une chaîne dans une fenêtre.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><em>window</em>.find(<em>aString</em>, <em>aCaseSensitive</em>, <em>aBackwards</em>, <em>aWrapAround</em>, + <em>aWholeWord</em>, <em>aSearchInFrames</em>, <em>aShowDialog</em>);</pre> + +<dl> + <dt><code>aString</code></dt> + <dd>La chaîne de caractère à rechercher.</dd> + <dt><code>aCaseSensitive</code></dt> + <dd>{{jsxref("Boolean")}}. Si <code>true</code>, spécifie une recherche sensible à la casse.</dd> + <dt><code>aBackwards</code></dt> + <dd>{{jsxref("Boolean")}}. Si <code>true</code>, spécifie une recherche vers l'arrière.</dd> + <dt><code>aWrapAround</code></dt> + <dd>{{jsxref("Boolean")}}. Si <code>true</code>, spécifie une recherche enveloppante.</dd> + <dt><code>aWholeWord</code> {{Unimplemented_Inline}}</dt> + <dd>{{jsxref("Boolean")}}. Si <code>true</code>, spécifie une recherche de mot entier. Ceci n'est pas implémenté; voir {{bug(481513)}}.</dd> + <dt><code>aSearchInFrames</code></dt> + <dd>{{jsxref("Boolean")}}. Si <code>true</code>, spécifie une recherche dans les cadres.</dd> +</dl> + +<h3 id="Retourne">Retourne</h3> + +<p><code>true</code> si la chaîne est trouvé; autrement, <code>false</code>.</p> + +<h2 id="Exemple">Exemple</h2> + +<h3 id="JavaScript">JavaScript</h3> + +<pre class="brush: js notranslate">findString = function findText(text) { + alert("String \x22" + text + "\x22 found? " + window.find(text)); +}</pre> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: html notranslate"><p>Apples, Bananas, and Oranges.</p> +<button type="button" onClick='findString("Apples")'>Search for Apples</button> +<button type="button" onClick='findString("Banana")'>Search for Banana</button> +<button type="button" onClick='findString("Orange")'>Search for Orange</button> +</pre> + +<h3 id="Résultat">Résultat</h3> + +<p>{{EmbedLiveSample("Example")}}</p> + +<h2 id="Notes">Notes</h2> + +<p>Dans certains navigateurs, <code>Window.find()</code> sélectionne (met en évidence) le contenu trouvé sur le site.</p> + +<h2 id="Spécification">Spécification</h2> + +<p id="comment_text_2">Cela ne fait partie d'aucune spécification.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>Cette méthode fonctionne dans de nombreux navigateurs modernes, notamment Firefox, Chrome, et Safari.</p> diff --git a/files/fr/web/api/window/focus/index.html b/files/fr/web/api/window/focus/index.html new file mode 100644 index 0000000000..51d55e804a --- /dev/null +++ b/files/fr/web/api/window/focus/index.html @@ -0,0 +1,39 @@ +--- +title: Window.focus() +slug: Web/API/Window/focus +translation_of: Web/API/Window/focus +--- +<p>{{APIRef}}</p> + +<h2 id="Résumé">Résumé</h2> + +<p>Demande la mise au premier plan de la fenêtre. Cet appel peut échouer en fonction des réglages utilisateurs, et ne garantit pas que la fenêtre sera au-dessus des autres au retour de cette méthode.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="eval">window.focus() +</pre> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="eval">if (clicked) { window.focus(); } +</pre> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="spectable standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG','interaction.html#dom-window-focus','Window.focus()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<p>{{ languages( { "ja": "ja/DOM/window.focus", "pl": "pl/DOM/window.focus" } ) }}</p> diff --git a/files/fr/web/api/window/frameelement/index.html b/files/fr/web/api/window/frameelement/index.html new file mode 100644 index 0000000000..46193efe10 --- /dev/null +++ b/files/fr/web/api/window/frameelement/index.html @@ -0,0 +1,70 @@ +--- +title: Window.frameElement +slug: Web/API/Window/frameElement +tags: + - API + - DOM + - Propriété + - Reference + - Window +translation_of: Web/API/Window/frameElement +--- +<div>{{ApiRef}}</div> + +<p><span class="seoSummary">La propriété <code><strong>Window.frameElement</strong></code> renvoie l'élément (tel que {{HTMLElement("iframe")}} ou {{HTMLElement("object")}}) dans lequel la fenêtre est intégrée.</span></p> + +<div class="note"> +<p><strong>Note:</strong> Malgré le nom de cette propriété, elle fonctionne pour les documents intégrés dans n'importe quel point d'incorporation, y compris {{HTMLElement("object")}}, {{HTMLElement("iframe")}}, ou {{HTMLElement("embed")}}.</p> +</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">const <em>frameEl</em> = window.frameElement +</pre> + +<h3 id="Valeur">Valeur</h3> + +<p>L'élément dans lequel la fenêtre est intégrée. Si la fenêtre n'est pas intégrée dans un autre document, ou si le document dans lequel elle est intégrée a un {{glossary("origin")}}, la valeur est {{jsxref("null")}} à la place.</p> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush:js notranslate">const frameEl = window.frameElement; +// Si nous sommes incorporés, modifiez l'URL de l'élément contenant en 'http://mozilla.org/' +if (frameEl) { + frameEl.src = 'http://mozilla.org/'; +} +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'browsers.html#dom-frameelement', 'Window.frameElement')}}</td> + <td>{{ Spec2('WebRTC 1.0') }}</td> + <td>Spécification initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div> +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.frameElement")}}</p> +</div> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("window.frames")}} renvoie un objet de type tableau, listant les sous-cadres directs de la fenêtre courante.</li> + <li>{{domxref("window.parent")}} renvoie la fenêtre parente, qui est la fenêtre contenant le <code>frameElement</code> de la fenêtre enfant.</li> +</ul> diff --git a/files/fr/web/api/window/frames/index.html b/files/fr/web/api/window/frames/index.html new file mode 100644 index 0000000000..3823eba20d --- /dev/null +++ b/files/fr/web/api/window/frames/index.html @@ -0,0 +1,49 @@ +--- +title: Window.frames +slug: Web/API/Window/frames +tags: + - API + - DOM + - DOM Reference + - DOM_0 + - Gecko + - NeedsContent + - NeedsUpdate + - Property + - Reference +translation_of: Web/API/Window/frames +--- +<p>{{ApiRef("Window")}}</p> + +<p> </p> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>Renvoie la fenêtre elle-même, qui est semblable à un objet de type Array, listant les frames présentes dans la fenêtre courante.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="eval"><em>frameList</em> = window.frames; +</pre> + +<ul> + <li><code>frameList</code> est une liste d'objets frame, semblable à un tableau grâce à la propriété <code>length</code> . Ses éléments sont accessibles en utilisant la notation <code>{{ mediawiki.external('i') }}</code>.</li> + <li><code>frameList === window</code> est évalué à <code>true</code>.</li> + <li>Chaque élément de window.frames est un pseudo tableau représentant l'objet <a class="internal" href="/en/DOM/window" title="en/DOM/window">window</a> correspondant au contenu de la <a class="internal" href="/en/HTML/Element/frame" title="en/HTML/Element/frame"><frame></a> ou <a class="internal" href="/en/HTML/Element/iframe" title="en/HTML/Element/iframe"><iframe></a> , et non au DOM element (i)frame (ex., <code>window.frames[ 0 ]</code> équivaut à <code>document.getElementsByTagName( "iframe" )[ 0 ].contentWindow</code>).</li> + <li>pour plus de détails sur la valeur retournée, se référer au <a class="external external-icon" href="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/5628c6f346859d4f/169aa7004565066?hl=en&ie=UTF-8&oe=utf-8&q=window.frames&pli=1" title="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/5628c6f346859d4f/169aa7004565066?hl=en&ie=UTF-8&oe=utf-8&q=window.frames&pli=1">fil de discussion sur mozilla.dev.platform</a>.</li> +</ul> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush: js">var frames = window.frames; // ou // var frames = window.parent.frames; +for (var i = 0; i < frames.length; i++) { + // faire quelque chose avec chaque subframe en tant que frames[i] + frames[i].document.body.style.background = "red"; +} +</pre> + +<h2 id="Specification" name="Specification">Spécifications</h2> + +<p id="comment_text_2">{{SpecName('HTML WHATWG','browsers.html#dom-frames','Window.frames')}}</p> + +<p> </p> diff --git a/files/fr/web/api/window/fullscreen/index.html b/files/fr/web/api/window/fullscreen/index.html new file mode 100644 index 0000000000..32fe1cb9bb --- /dev/null +++ b/files/fr/web/api/window/fullscreen/index.html @@ -0,0 +1,36 @@ +--- +title: window.fullScreen +slug: Web/API/Window/fullScreen +tags: + - DOM + - DOM_0 + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/fullScreen +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Cette propriété indique si la fenêtre est affichée en mode plein écran ou non. Elle n'est fiable qu'à partir de Gecko 1.9 (Firefox 3), voir les Notes plus bas.</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre class="eval">var <var>isInFullScreen</var> = <var>windowRef</var>.fullScreen; +</pre> +<p>Avec les privilèges chrome, la propriété est modifiable ; autrement elle est en lecture seule. Souvenez-vous que si vous essayez de définir cette propriété sans les privilèges chrome, aucune exception ne sera déclenchée et l'appel échouera juste silencieusement. Cela permet d'empêcher que des scripts conçus pour utiliser cette propriété dans Internet Explorer cessent de fonctionner.</p> +<h3 id="Valeur_de_retour" name="Valeur_de_retour">Valeur de retour</h3> +<dl> + <dt> + <code>isInFullScreen</code></dt> + <dd> + Une valeur booléenne. Signification des valeurs :</dd> +</dl> +<ul> + <li><code>true</code> : La fenêtre est en mode plein écran.</li> + <li><code>false</code> : La fenêtre n'est pas en mode plein écran.</li> +</ul> +<h3 id="Exemples" name="Exemples">Exemples</h3> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>{{ DOM0() }}</p> +<h3 id="Notes" name="Notes">Notes</h3> +<p>Cette propriété n'est fiable qu'à partir de Mozilla 1.9 (Firefox 3). Mozilla 1.8 et les versions antérieures disposent de cette propriété, mais elle renvoie toujours <code>false</code>, même quand la fenêtre est en mode plein écran ({{ Bug(127013) }}).</p> +<p> </p> +<div class="noinclude"> + </div> +<p>{{ languages( { "en": "en/DOM/window.fullScreen", "es": "es/DOM/window.fullScreen", "ja": "ja/DOM/window.fullScreen" } ) }}</p> diff --git a/files/fr/web/api/window/gamepadconnected_event/index.html b/files/fr/web/api/window/gamepadconnected_event/index.html new file mode 100644 index 0000000000..0f68232b6c --- /dev/null +++ b/files/fr/web/api/window/gamepadconnected_event/index.html @@ -0,0 +1,86 @@ +--- +title: gamepadconnected +slug: Web/API/Window/gamepadconnected_event +translation_of: Web/API/Window/gamepadconnected_event +--- +<p>L'événement gamepadconnected est déclenché lorsque le navigateur détecte quand une manette a été connecté ou qu'un button/axe de la manette a été utilisé pour la première fois.<br> + </p> + +<h2 id="Informations_générales">Informations générales</h2> + +<dl> + <dt style="float: left; text-align: right; width: 120px;">Spécification</dt> + <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/gamepad/#the-gamepadconnected-event">Gamepad</a></dd> + <dt style="float: left; text-align: right; width: 120px;">Interface</dt> + <dd style="margin: 0 0 0 120px;">Event</dd> + <dt style="float: left; text-align: right; width: 120px;">Propagation</dt> + <dd style="margin: 0 0 0 120px;">Non</dd> + <dt style="float: left; text-align: right; width: 120px;">Annulable</dt> + <dd style="margin: 0 0 0 120px;">Non</dd> + <dt style="float: left; text-align: right; width: 120px;">Cible</dt> + <dd style="margin: 0 0 0 120px;">DefaultView (<code><window></code>)</dd> + <dt style="float: left; text-align: right; width: 120px;">Action par défaut</dt> + <dd style="margin: 0 0 0 120px;">Aucune</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Property</th> + <th scope="col">Type</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>target</code> {{readonlyInline}}</td> + <td>{{domxref("EventTarget")}}</td> + <td>The event target (the topmost target in the DOM tree).</td> + </tr> + <tr> + <td><code>type</code> {{readonlyInline}}</td> + <td>{{domxref("DOMString")}}</td> + <td>The type of event.</td> + </tr> + <tr> + <td><code>bubbles</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event normally bubbles or not.</td> + </tr> + <tr> + <td><code>cancelable</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event is cancellable or not.</td> + </tr> + <tr> + <td><code>gamepad</code> {{readonlyInline}}</td> + <td>{{domxref("Gamepad")}}</td> + <td>The single gamepad attribute provides access to the associated gamepad data for this event.</td> + </tr> + </tbody> +</table> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush:js;">// Noter que l'API a toujours des préfixes vendeur dans les navigateurs l'implémentant +window.addEventListener("gamepadconnected", function( event ) { + + // Toutes la valeurs d'axes et les buttons sont accessibles à travers: + event.gamepad; + +}); +</pre> + +<h2 id="Evénements_liés">Evénements liés</h2> + +<ul> + <li><a href="https://developer.mozilla.org/en-US/docs/Web/Reference/Events/gamepaddisconnected">gamepaddisconnected</a></li> +</ul> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/API/Gamepad/Using_Gamepad_API">Utilisation de l'API Gamepad</a></li> +</ul> diff --git a/files/fr/web/api/window/gamepaddisconnected_event/index.html b/files/fr/web/api/window/gamepaddisconnected_event/index.html new file mode 100644 index 0000000000..f62baa963a --- /dev/null +++ b/files/fr/web/api/window/gamepaddisconnected_event/index.html @@ -0,0 +1,74 @@ +--- +title: gamepaddisconnected +slug: Web/API/Window/gamepaddisconnected_event +translation_of: Web/API/Window/gamepaddisconnected_event +--- +<p>L'événement <code>gamepaddisconnected</code> est déclenché lorsque le navigateur détecte le fait qu'une manette ait été débranchée.</p> + +<h2 id="Informations_générales">Informations générales</h2> + +<dl> + <dt style="float: left; text-align: right; width: 120px;">Spécification</dt> + <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.w3.org/TR/gamepad/#the-gamepaddisconnected-event">Gamepad</a></dd> + <dt style="float: left; text-align: right; width: 120px;">Interface</dt> + <dd style="margin: 0 0 0 120px;">{{domxref("Event")}}</dd> + <dt style="float: left; text-align: right; width: 120px;">Propagation</dt> + <dd style="margin: 0 0 0 120px;">Non</dd> + <dt style="float: left; text-align: right; width: 120px;">Annulable</dt> + <dd style="margin: 0 0 0 120px;">Non</dd> + <dt style="float: left; text-align: right; width: 120px;">Cible</dt> + <dd style="margin: 0 0 0 120px;">DefaultView (<code><window></code>)</dd> + <dt style="float: left; text-align: right; width: 120px;">Action par défaut</dt> + <dd style="margin: 0 0 0 120px;">Aucune</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Property</th> + <th scope="col">Type</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>target</code> {{readonlyInline}}</td> + <td>{{domxref("EventTarget")}}</td> + <td>The event target (the topmost target in the DOM tree).</td> + </tr> + <tr> + <td><code>type</code> {{readonlyInline}}</td> + <td>{{domxref("DOMString")}}</td> + <td>The type of event.</td> + </tr> + <tr> + <td><code>bubbles</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event normally bubbles or not.</td> + </tr> + <tr> + <td><code>cancelable</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event is cancellable or not.</td> + </tr> + <tr> + <td><code>gamepad</code> {{readonlyInline}}</td> + <td>{{domxref("Gamepad")}}</td> + <td>The single gamepad attribute provides access to the associated gamepad data for this event.</td> + </tr> + </tbody> +</table> + +<h2 id="Evénements_liés">Evénements liés</h2> + +<ul> + <li><a href="https://developer.mozilla.org/fr/docs/Web/Reference/Events/gamepadconnected">gamepadconnected</a></li> +</ul> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/API/Gamepad/Using_Gamepad_API">Utilisation de l'API Gamepad</a></li> +</ul> diff --git a/files/fr/web/api/window/getcomputedstyle/index.html b/files/fr/web/api/window/getcomputedstyle/index.html new file mode 100644 index 0000000000..028dc774a8 --- /dev/null +++ b/files/fr/web/api/window/getcomputedstyle/index.html @@ -0,0 +1,164 @@ +--- +title: window.getComputedStyle +slug: Web/API/Window/getComputedStyle +translation_of: Web/API/Window/getComputedStyle +--- +<p>{{ ApiRef() }}</p> + +<h2 id="Résumé">Résumé</h2> + +<p><code>La méthode window.getComputedStyle() </code>donne la <a href="/en/CSS/used_value" title="https://developer.mozilla.org/en/CSS/used_value">valeur calculée finale</a> de toutes les propriétés CSS sur un élément.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="eval">var <em>style</em> = window.getComputedStyle(<em>element</em>[, <em>pseudoElt</em>]);</pre> + +<dl> + <dt>element</dt> + <dd>L’{{ domxref("Element") }} pour lequel vous voulez obtenir une valeur calculée.</dd> + <dt>pseudoElt {{ optional_inline() }}</dt> + <dd>Chaîne de caractère spécifiant le pseudo-élément à cibler. Doit être <code>null</code> (ou non spécifiée) pour les éléments communs.</dd> +</dl> + +<div class="note"><strong>Note:</strong> Avant Gecko 2.0 {{ geckoRelease("2.0") }}, le paramètre <code>pseudoElt</code> était obligatoire. Aucun autre navigateur majeur ne requiert que ce paramètre soit renseigné si il est null. Gecko a été modifié pour se comporter comme les autres navigateurs.</div> + +<p>La valeur de retour <code>style</code> est un objet <a href="/en/DOM/CSSStyleDeclaration" title="en/DOM/CSSStyleDeclaration"><code>CSSStyleDeclaration</code></a>.</p> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush: js">var elem1 = document.getElementById("elemId"); +var style = window.getComputedStyle(elem1, null); + +// Ce qui équivaut à : +// var style = document.defaultView.getComputedStyle(elem1, null); +</pre> + +<pre class="brush: js"><style> + #elem-container{ + position: absolute; + left: 100px; + top: 200px; + height: 100px; + } +</style> + +<div id="elem-container">dummy</div> +<div id="output"></div> + +<script> + function getTheStyle(){ + var elem = document.getElementById("elem-container"); + var theCSSprop = window.getComputedStyle(elem,null).getPropertyValue("height"); + document.getElementById("output").innerHTML = theCSSprop; + } + getTheStyle(); +</script> +</pre> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="function token">function dumpComputedStyles</span><span class="punctuation token">(</span>elem<span class="punctuation token">,</span>prop<span class="punctuation token">)</span> <span class="punctuation token">{</span> + + <span class="keyword token">var</span> cs <span class="operator token">=</span> window<span class="punctuation token">.</span><span class="function token">getComputedStyle</span><span class="punctuation token">(</span>elem<span class="punctuation token">,</span><span class="keyword token">null</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span>prop<span class="punctuation token">)</span> <span class="punctuation token">{</span> + console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>prop<span class="operator token">+</span><span class="string token">" : "</span><span class="operator token">+</span>cs<span class="punctuation token">.</span><span class="function token">getPropertyValue</span><span class="punctuation token">(</span>prop<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">return</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + <span class="keyword token">var</span> len <span class="operator token">=</span> cs<span class="punctuation token">.</span>length<span class="punctuation token">;</span> + <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i<span class="operator token">=</span><span class="number token">0</span><span class="punctuation token">;</span>i<span class="operator token"><</span>len<span class="punctuation token">;</span>i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + + <span class="keyword token">var</span> style <span class="operator token">=</span> cs<span class="punctuation token">[</span>i<span class="punctuation token">]</span><span class="punctuation token">;</span> + console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>style<span class="operator token">+</span><span class="string token">" : "</span><span class="operator token">+</span>cs<span class="punctuation token">.</span><span class="function token">getPropertyValue</span><span class="punctuation token">(</span>style<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="punctuation token">}</span> + +<span class="punctuation token">}</span></code></pre> + +<h2 id="Description">Description</h2> + +<p>L'objet retourné est du même type que celui de la propriété {{domxref("HTMLElement.style", "style")}} de l'élément ciblé. Toutefois les deux objets ont des buts distincts. L'objet retourné par la méthode <code>getComputedStyle</code> est en lecture seule et peut être utilisée pour inspecter le style de l'élément y compris ceux ajoutés via un élément <code><style></code> ou une feuille de style externe. L'objet <code>elt.style</code> doit quant à lui être utilisé pour mettre à jour une propriété de style sur un élément donné.</p> + +<p>Le premier argument doit être un Element, sinon, si par exemple un #text Node est utilisé, une exception sera lancée. Depuis la version 1.9.2 de Gecko {{geckoRelease("1.9.2")}}, les URLs renvoyées ont désormais des guillemets autour de celles-ci: <code>url("http://foo.com/bar.jpg")</code>.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>9</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td>pseudo-element support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>9</td> + <td>15</td> + <td>{{CompatVersionUnknown}} </td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>WP7 Mango</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td>pseudo-element support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Spécification">Spécification</h2> + +<ul> + <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSview-getComputedStyle">DOM Level 2 Style: getComputedStyle</a></li> + <li><a href="http://dev.w3.org/csswg/cssom/#resolved-values" title="http://dev.w3.org/csswg/cssom/#resolved-values">CSS Object Model specification</a></li> +</ul> + +<h2 id="See_also" name="See_also">Voir aussi</h2> + +<ul> + <li>{{domxref("window.getDefaultComputedStyle")}}</li> + <li>{{cssxref("resolved_value", "Resolved Value")}}</li> +</ul> diff --git a/files/fr/web/api/window/getdefaultcomputedstyle/index.html b/files/fr/web/api/window/getdefaultcomputedstyle/index.html new file mode 100644 index 0000000000..de387ec600 --- /dev/null +++ b/files/fr/web/api/window/getdefaultcomputedstyle/index.html @@ -0,0 +1,149 @@ +--- +title: Window.getDefaultComputedStyle() +slug: Web/API/Window/getDefaultComputedStyle +tags: + - API + - CSS + - Method + - Reference +translation_of: Web/API/window/getDefaultComputedStyle +--- +<div>{{APIRef("CSSOM")}}{{Non-standard_header}}</div> + +<p><code>getDefaultComputedStyle()</code> fournit les valeurs calculées par défaut de toutes les propriétés CSS d'un élément, en ignorant la mise en forme de l'auteur. C'est-à-dire que seules les mises en forme de l'agent utilisateur et de l'utilisateur sont pris en compte.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var <em>miseEnForme</em> = window.getDefaultComputedStyle(<em>element</em>[, <em>pseudoElt</em>]); +</pre> + +<dl> + <dt>element</dt> + <dd>L'{{domxref("Element")}} dont on veut obtenir la mise en forme calculée.</dd> + <dt>pseudoElt {{optional_inline}}</dt> + <dd>Une chaîne indiquant le pseudo-élément à rechercher. Doit être <code>null</code> (ou non indiqué) pour les éléments ordinaires.</dd> +</dl> + +<p>Le <code>style</code> retourné est un objet <a href="/fr-FR/docs/Web/API/CSSStyleDeclaration"><code>CSSStyleDeclaration</code></a>.</p> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js">var elem1 = document.getElementById("IdElem"); +var miseEnForme = window.getDefaultComputedStyle(elem1); +</pre> + +<pre class="brush: js"><style> +#conteneur-elem { + position: absolute; + left: 100px; + top: 200px; + height: 100px; + } +</style> + +<div id="conteneur-elem">factice</div> +<div id="sortie"></div> + +<script> + var elem = document.getElementById("conteneur-elem"); + var laPropCSS = window.getDefaultComputedStyle(elem).position; + document.getElementById("sortie").innerHTML = laPropCSS; // affichera "static" +</script> </pre> + +<h2 id="Description">Description</h2> + +<p>L'objet retourné est du même type que l'objet retourné par <code>getComputedStyle</code>, mais il ne prend en compte que les règles user-agent et user.</p> + +<h2 id="Utilisation_avec_des_pseudo-éléments">Utilisation avec des pseudo-éléments</h2> + +<p><code>getDefaultComputedStyle</code> peut extraire des informations de mise en forme à partir de pseudo-éléments (par exemple, ::after, ::before).</p> + +<pre class="brush: html"><style> + h3:after { + content: ' déchire !'; + } +</style> + +<h3>contenu généré</h3> + +<script> + var h3 = document.querySelector('h3'), + resultat = getDefaultComputedStyle(h3, ':after').content; + + console.log('le contenu généré est : ', resultat); // retourne 'none' +</script> +</pre> + +<h2 id="Notes">Notes</h2> + +<p>La valeur retournée est, dans certains cas connus, expressément incorrecte par intention délibérée. En particulier, pour éviter le problème de sécurité appelé CSS History Leak, les navigateurs peuvent "mentir" sur la valeur utilisée pour un lien et toujours retourner des valeurs comme si l'utilisateur n'avait jamais visité le site concerné, et/ou limiter les styles qui peuvent être appliqués via l'utilisation du pseudo-sélecteur <code>:visited</code>. Voir <a href="http://blog.mozilla.com/security/2010/03/31/plugging-the-css-history-leak/">http://blog.mozilla.com/security/2010/03/31/plugging-the-css-history-leak/</a> et <a href="http://hacks.mozilla.org/2010/03/privacy-related-changes-coming-to-css-vistited/">http://hacks.mozilla.org/2010/03/privacy-related-changes-coming-to-css-visited/</a> pour le détail des exemples de la manière dont cela est implémenté.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<p>Proposé au groupe de travail CSS.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>19</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td>pseudo-element support</td> + <td>{{CompatNo}}</td> + <td>19</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>19</td> + <td>7.5</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td>pseudo-element support</td> + <td>{{CompatNo}}</td> + <td>19</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> diff --git a/files/fr/web/api/window/getselection/index.html b/files/fr/web/api/window/getselection/index.html new file mode 100644 index 0000000000..9e2bfde703 --- /dev/null +++ b/files/fr/web/api/window/getselection/index.html @@ -0,0 +1,47 @@ +--- +title: window.getSelection +slug: Web/API/Window/getSelection +translation_of: Web/API/Window/getSelection +--- +<p>{{ ApiRef() }}</p> + +<p>Renvoie un objet selection représentant le ou les objets sélectionnés.</p> + +<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> + +<pre class="eval"><em>selection</em> = window.getSelection() +</pre> + +<h2 id="Param.C3.A8tres" name="Param.C3.A8tres">Paramètres</h2> + +<ul> + <li><code>selection</code> est un objet de type {{DOMxRef("Selection")}}.</li> +</ul> + +<h2 id="Exemple" name="Exemple">Exemple</h2> + +<pre class="eval">function foo() { + var selObj = window.getSelection(); + alert(selObj); + var selRange = selObj.getRangeAt(0); + // travailler avec la sélection +} +</pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>En <a href="fr/JavaScript">JavaScript</a>, lorsqu'un objet de type Selection est passé à une fonction, c'est une représentation sous forme de chaîne (string), c'est-à-dire le texte sélectionné, qui lui est passée à la place. L'objet selection apparaît donc comme une chaîne, alors qu'il s'agit en réalité d'un objet possédant ses propres propriétés et méthodes. En pratique, c'est donc la valeur renvoyée par la méthode <code><a href="fr/DOM/Selection/toString">toString</a></code> de l'objet Selection qui est passée. Dans l'exemple ci-dessus, <code>selObj</code> est automatiquement « convertie » lorsqu'elle est passée à <a href="fr/DOM/window.alert">window.alert</a>. Cependant, pour utiliser une propriété ou méthode JavaScript de <a href="fr/JS/String">String</a> comme <code><a href="fr/JS/String.prototype.length">length</a></code> ou <code><a href="fr/JS/String.prototype.substr">substr</a></code>, il est nécessaire d'appeler manuellement la méthode <code>toString</code>. <span class="comment">I'm treading carefully with the word "convert" here because it could be misinterpreted as a permanent convert - Maian</span></p> + +<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2> + +<p>DOM Level 0. Ne fait partie d'aucune spécification.</p> + +<h2 id="Voir_aussi" name="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="../Selection_API">Selection API</a></li> + <li><a href="../Selection" title="Un objet Sélection représente la plage de texte sélectionnée par l'utilisateur ou la position actuelle du signe d'insertion. Pour obtenir un objet Sélection pour examen ou modification, appelez Window.getSelection()"><code>Selection</code></a></li> + <li><a href="../Range" title="L'interface Range représente un fragment d'un document qui peut contenir des nœuds et des parties de nœuds texte."><code>Range</code></a></li> + <li><a href="../Document/getSelection" title="La propriété getSelection() de l'interface DocumentOrShadowRoot renvoie un objet Selection, représentant l'étendue du texte sélectionné par l'utilisateur, ou la position actuelle du curseur."><code>Document.getSelection()</code></a></li> + <li><a href="../HTMLInputElement/setSelectionRange" title="La méthode HTMLInputElementElement.setSelectionRange() définit les positions de début et de fin de la sélection de texte courante dans un élément <input&gt ;."><code>HTMLInputElement.setSelectionRange()</code></a></li> +</ul> diff --git a/files/fr/web/api/window/hashchange_event/index.html b/files/fr/web/api/window/hashchange_event/index.html new file mode 100644 index 0000000000..39926c03f5 --- /dev/null +++ b/files/fr/web/api/window/hashchange_event/index.html @@ -0,0 +1,193 @@ +--- +title: hashchange +slug: Web/API/Window/hashchange_event +tags: + - Reference + - Web +translation_of: Web/API/Window/hashchange_event +--- +<p>L'événement <code>hashchange</code> est déclenché lorsque l'identificateur de fragment de l'URL a changé (la partie de l'URL qui suit le symbole #, y compris le symbole # lui-même).</p> + +<table class="properties"> + <tbody> + <tr> + <td>Bulles</td> + <td>Oui</td> + </tr> + <tr> + <td>Annulable</td> + <td>Non</td> + </tr> + <tr> + <td>Objets cibles</td> + <td>{{domxref("Window")}}</td> + </tr> + <tr> + <td>Interface</td> + <td>{{domxref("HashChangeEvent")}}</td> + </tr> + <tr> + <td>Action par défaut</td> + <td>Aucune</td> + </tr> + </tbody> +</table> + +<h2 id="Propriétés">Propriétés</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Propriété</th> + <th scope="col">Type</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>target</code> {{readonlyInline}}</td> + <td>{{domxref("EventTarget")}}</td> + <td>The browsing context (<code>window</code>).</td> + </tr> + <tr> + <td><code>type</code> {{readonlyInline}}</td> + <td>{{domxref("DOMString")}}</td> + <td>Type de l'évènement</td> + </tr> + <tr> + <td><code>bubbles</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event normally bubbles or not.</td> + </tr> + <tr> + <td><code>cancelable</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event is cancellable or not.</td> + </tr> + <tr> + <td><code>oldURL</code> {{readonlyInline}}</td> + <td>{{jsxref("String")}}</td> + <td>The previous URL from which the window was navigated.</td> + </tr> + <tr> + <td>newURL {{readonlyInline}}</td> + <td>{{jsxref("String")}}</td> + <td></td> + </tr> + </tbody> +</table> + +<p>Il existe plusieurs scripts de secours listés sur <a href="https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills">cette page</a>. Fondamentalement, ces scripts vérifient le <code>location.hash</code> à intervalles réguliers. Voici une version qui n'autorise qu'un seul gestionnaire à être lié à la propriété <code>window.onhashchange</code>:</p> + +<pre class="brush:js;">;(function(window) { + + // Sortir si le navigateur implémente cet événement + if ("onhashchange" in window) { return; } + + var location = window.location, + oldURL = location.href, + oldHash = location.hash; + + // Vérifie la hash de la barre d'adresse toutes les 100ms + setInterval(function() { + var newURL = location.href, + newHash = location.hash; + + // Si le hash a été changé et qu'un gestionnaire a été lié... + if (newHash != oldHash && typeof window.onhashchange === "function") { + // exécute le gestionnaire + window.onhashchange({ + type: "hashchange", + oldURL: oldURL, + newURL: newURL + }); + + oldURL = newURL; + oldHash = newHash; + } + }, 100); + +})(window); +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Status</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'indices.html#event-hashchange', 'hashchange')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Support basique</td> + <td>5.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9.2")}}<sup>[1]</sup></td> + <td>8.0<sup>[2]</sup></td> + <td>10.6</td> + <td>5.0</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Support basique</td> + <td>2.2</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1.9.2")}}</td> + <td>9.0</td> + <td>11.0</td> + <td>5.0</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Support pour les attributs <code>oldURL</code>/<code>newURL</code> ajouté à Firefox 6.</p> + +<p>[2] Les attributs <code>oldURL</code>/<code>newURL</code> ne sont pas supportés.</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Mozilla_event_reference/popstate"><code>popstate</code></a></li> + <li><a href="/en-US/docs/Web/API/WindowEventHandlers/onhashchange">WindowEventHandlers.onhashchange</a></li> +</ul> diff --git a/files/fr/web/api/window/history/index.html b/files/fr/web/api/window/history/index.html new file mode 100644 index 0000000000..65ab9cfe4e --- /dev/null +++ b/files/fr/web/api/window/history/index.html @@ -0,0 +1,53 @@ +--- +title: Window.history +slug: Web/API/Window/history +translation_of: Web/API/Window/history +--- +<div>{{APIRef}}</div> + +<p>La propriété en lecture seule <strong style="font-family: 'Courier New','Andale Mono',monospace; line-height: inherit;">Window.history</strong> renvoie une référence à l'objet <span style="line-height: inherit;">{{domxref("History")}}, qui offre la possibilité de manipuler l'historique de session du navigateur (pages visitées dans l'onglet ou le cadre dans lesquels la page courante est chargée).</span></p> + +<p>L'objet <code style="font-size: 14px; line-height: inherit;">History</code><span style="line-height: inherit;"> obtenu a les méthodes suivantes : voir </span><a href="/en/DOM/Manipulating_the_browser_history" style="line-height: inherit;" title="en/DOM/Manipulating the browser history">la manipulation de l'historique du navigateur</a><span style="line-height: inherit;"> pour avoir plus de détails ainsi que des exemples.<br> + En particulier, cet article explique les caractéristiques des méthodes </span><code style="font-size: 14px; line-height: inherit;">pushState()</code><span style="line-height: inherit;"> et </span><code style="font-size: 14px; line-height: inherit;">replaceState()</code><span style="line-height: inherit;">qu'il est utile de connaître avant de les utiliser.</span></p> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush: js">history.back(); // similaire au bouton de retour +history.go(-1); // similaire à history.back(); +</pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>Pour les pages de niveau supérieur, vous pourrez voir la liste des pages dans l'historique des sessions, accessibles grâce à l'objet <code style="font-size: 14px; line-height: inherit;">History</code><span style="line-height: inherit;">, situé dans le menu déroulant près des boutons précédent et suivant.</span></p> + +<p><span style="line-height: inherit;">Pour des raisons de sécurité, l'objet </span><code style="font-size: 14px; line-height: inherit;">History</code><span style="line-height: inherit;"> n'autorise pas l'accès au URL d'autres pages présentes dans l'historique de la session mais autorise d'y naviguer.</span></p> + +<p>Il n'y a pas de possibilité de nettoyer l'historique de la session ou de désactiver les boutons précédent et suivant. La solution éventuelle la plus proche serait la méthode <a href="/en/DOM/window.location#replace" style="line-height: inherit; font-family: 'Courier New', 'Andale Mono', monospace;" title="en/DOM/window.location#replace">location.replace()</a>, permettant de remplacer l'élément actuel de l'historique de la session par l'URL fournie.</p> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'browsers.html#the-history-interface', 'The History interface')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#the-history-interface', 'The History interface')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + + + +<p>{{Compat("api.Window.history")}}</p> diff --git a/files/fr/web/api/window/home/index.html b/files/fr/web/api/window/home/index.html new file mode 100644 index 0000000000..45d11a4ad5 --- /dev/null +++ b/files/fr/web/api/window/home/index.html @@ -0,0 +1,38 @@ +--- +title: Window.home() +slug: Web/API/Window/home +tags: + - API + - Gecko + - HTML DOM + - Méthode + - Obsolete + - Reference + - Window +translation_of: Web/API/Window/home +--- +<div>{{APIRef}}{{ Non-standard_header() }} {{ obsolete_header(31) }}</div> + +<p>La méthode <code><strong>Window.home()</strong></code> renvoie la fenêtre à la page d'accueil.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><em>window</em>.home(); +</pre> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush: js notranslate">function goHome() { + window.home(); +} +</pre> + +<h2 id="Spécification">Spécification</h2> + +<p>DOM Niveau 0. Ne fait pas partie de la spécification.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.home")}}</p> diff --git a/files/fr/web/api/window/importdialog/index.html b/files/fr/web/api/window/importdialog/index.html new file mode 100644 index 0000000000..8b870f39d6 --- /dev/null +++ b/files/fr/web/api/window/importdialog/index.html @@ -0,0 +1,64 @@ +--- +title: window.importDialog +slug: Web/API/Window/importDialog +tags: + - Traduction_à_relire +translation_of: Archive/Web/Window.importDialog +--- +<p>{{ ApiRef() }}</p> +<div class="note"> + Cette page vient d'être traduite, mais elle a besoin d'un relecteur différent du traducteur. Pensez également à toujours vérifier le contenu avec sa toute dernière version en anglais.</div> +<h2 id="Résumé">Résumé</h2> +<p>Puisque ouvrir une nouvelle fenêtre sur une plateforme mobile n'est pas vraiment approprié, l'équipe de Firefox Mobile a créé la méthode <code>importDialog()</code> pour remplacer {{ domxref("window.openDialog()") }}. Au lieu d'ouvrir une nouvelle fenêtre, elle fusionne l'élément XUL <code>dialog</code> spécifié avec la fenêtre principale.</p> +<h2 id="Syntaxe">Syntaxe</h2> +<pre><em>newDialog</em> = importDialog(<em>aParent</em>, <span style="font-style: italic;">aSrc</span>, aArguments) +</pre> +<dl> + <dt> + <code>newDialog</code></dt> + <dd> + La fenêtre ouverte.</dd> + <dt> + <code>aParent</code></dt> + <dd> + L'élément parent de la boîte de dialogue. Peut être <code>null</code>.</dd> + <dt> + <code>aSrc</code></dt> + <dd> + L'URL chrome vers la boîte de dialogue XUL.</dd> + <dt> + <code>aArguments</code></dt> + <dd> + Un objet JavaScript contenant les données à passer à la boîte de dialogue.</dd> +</dl> +<h2 id="Exemple">Exemple</h2> +<pre class="eval language-html"><em>newDialog</em> = importDialog(<em>aParent</em>, <span style="font-style: italic;">aSrc</span>, aArguments) +</pre> +<dl> + <dt> + <code>newDialog</code></dt> + <dd> + La fenêtre ouverte</dd> + <dt> + <code>aParent</code></dt> + <dd> + La parent de la fenêtre, éventuellement <code>null</code>.</dd> + <dt> + <code>aSrc</code></dt> + <dd> + L'URL chrome de la boîte de dialogue XUL.</dd> + <dt> + <code>aArguments</code></dt> + <dd> + Un objet JavaScript contenant les données à transférer à la boîte de dialogue.</dd> +</dl> +<h2 id="Notes">Notes</h2> +<p>Le XUL passé à la méthode <code>importDialog()</code> est très similaire à celui passé à la méthode {{ domxref("window.openDialog()") }}, avec cependant quelques limitations et mises en garde :</p> +<ul> + <li>La racine doit être un élément <code><dialog></code>.</li> + <li>Les scripts ne doivent pas être chargés via la balise <code><script></code>, mais depuis un attribut de l'élément <code><dialog></code> .</li> +</ul> +<p>Le XUL est fusionné avec la fenêtre spécifiée, un peu à la manière d'un overlay. En conséquence, des conflits entre les identifiants (attributs <code>id</code>) et les scripts JavaScript sont possibles, comme avec les overlays. Prenez cela en considération.</p> +<h2 id="Spécification">Spécification</h2> +<p>{{ DOM0() }}</p> +<p>{{ languages( { "en": "en/DOM/window.importDialog", "fr": "fr/DOM/window.importDialog" } ) }}</p> diff --git a/files/fr/web/api/window/index.html b/files/fr/web/api/window/index.html new file mode 100644 index 0000000000..17a9f19ab8 --- /dev/null +++ b/files/fr/web/api/window/index.html @@ -0,0 +1,665 @@ +--- +title: window +slug: Web/API/Window +tags: + - API + - DOM + - Interface + - JavaScript + - Reference + - Window +translation_of: Web/API/Window +--- +<p>{{APIRef}}</p> + +<p><span class="seoSummary">L'objet <code>window</code> représente une fenêtre contenant un document DOM ; la propriété <code>document</code> pointe vers le <a href="/fr-FR/docs/DOM/document">document DOM</a> chargé dans cette fenêtre.</span> Une fenêtre pour un document donné peut être obtenue en utilisant la propriété {{Domxref("document.defaultView")}}.</p> + +<p>Cette section fournit une brève référence pour toutes les méthodes, propriétés et événements disponibles via l'objet DOM <code>window</code>. L'objet <code>window</code> implémente l'interface <code>Window</code>, qui à son tour hérite de l'interface <code><a href="http://www.w3.org/TR/DOM-Level-2-Views/views.html#Views-AbstractView">AbstractView</a></code>. Certaines fonctions globales supplémentaires, espaces de noms, objets, interfaces et constructeurs, non typiquement associés à la fenêtre, mais disponibles sur celle-ci, sont répertoriés dans la <a href="/fr-FR/docs/JavaScript/Reference">Référence JavaScript</a> et la <a href="/fr-FR/docs/Web/API/Document_Object_Model" title="/fr-FR/docs/Web/API/Document_Object_Model">Référence DOM</a>.</p> + +<p>Dans un navigateur utilisant des onglets, comme Firefox, chaque onglet contient son propre objet <code>window</code> (et si vous écrivez une extension, la fenêtre du navigateur elle-même est un objet <code>window</code> séparé — consultez <a href="/fr/docs/Mozilla/Working_with_windows_in_chrome_code#Fen.C3.AAtres_de_contenu">Travailler avec des fenêtres dans du code chrome</a> pour plus d'informations). C'est-à-dire que l'objet <code>window</code> n'est pas partagé entre les onglets dans la même fenêtre. Certaines méthodes, notamment {{ Domxref("window.resizeTo") }} et {{ Domxref("window.resizeBy") }}, s'appliquent à la fenêtre entière et non à l'onglet spécifique auquel l'objet <code>window</code> appartient. En général, ce qui ne peut raisonnablement pas concerner un onglet se rapporte à la fenêtre à la place.</p> + +<p>{{InheritanceDiagram}}</p> + +<h2 id="Propriétés">Propriétés</h2> + +<p><em>Cette interface hérite des propriétés de l'interface {{domxref("EventTarget")}} et implémente les propriétés des mixins {{domxref("WindowOrWorkerGlobalScope")}} et {{domxref("WindowEventHandlers")}}.</em></p> + +<p>Notez que les propriétés qui sont des objets (par exemple, pour redéfinir le prototype d'éléments intrinsèques) sont répertoriées dans une section distincte ci-dessous.</p> + +<dl> + <dt>{{domxref("Window.closed")}} {{Non-standard_inline}}{{readOnlyInline}}</dt> + <dd>Cette propriété indique si la fenêtre en cours est fermée ou non.</dd> + <dt>{{domxref("Window.console")}} {{ReadOnlyInline}}</dt> + <dd>Renvoie une référence à l'objet console qui fournit l'accès à la console de débogage du navigateur.</dd> + <dt>{{domxref("Window.content")}} et Window._content {{Non-standard_inline}} {{obsolete_inline}}{{ReadOnlyInline}}</dt> + <dd>Renvoie une référence à l'élément de contenu dans la fenêtre en cours. Depuis Firefox 57 (initialement Nightly uniquement), les deux versions sont uniquement disponibles à partir du code chrome (privilégié) et ne sont plus disponibles sur le Web.</dd> + <dt>{{domxref("Window.controllers")}}{{non-standard_inline}}{{ReadOnlyInline}}</dt> + <dd>Renvoie les objets du contrôleur XUL pour la fenêtre chrome en cours.</dd> + <dt>{{domxref("Window.customElements")}}{{ReadOnlyInline}}</dt> + <dd>renvoie une référence à l'objet {{domxref("CustomElementRegistry")}}, qui peut être utilisée pour enregistrer de nouveaux <a href="https://developer.mozilla.org/fr-FR/docs/Web/Web_Components/Using_custom_elements">éléments personnalisés</a> et obtenir des informations à propos d'éléments personnalisés précédemment enregistrés.</dd> + <dt>{{domxref("Window.crypto")}} {{readOnlyInline}}</dt> + <dd>Retourne l'objet crypto du navigateur.</dd> + <dt>{{domxref("Window.defaultStatus")}} {{Obsolete_inline("gecko23")}}</dt> + <dd>Récupère / définit le texte de la barre d'état pour la fenêtre donnée.</dd> + <dt>{{domxref("Window.devicePixelRatio")}} {{non-standard_inline}}{{ReadOnlyInline}}</dt> + <dd>Renvoie le rapport entre les pixels physiques et les pixels indépendants du périphérique dans l'affichage en cours.</dd> + <dt>{{domxref("Window.dialogArguments")}} {{Fx_minversion_inline(3)}} {{ReadOnlyInline}}</dt> + <dd>Récupère les arguments passés à la fenêtre (si c'est une boîte de dialogue) au moment où {{domxref ("window.showModalDialog()")}} a été appelé. C'est un {{Interface("nsIArray")}}.</dd> + <dt>{{domxref("Window.directories")}} {{obsolete_inline}}</dt> + <dd>Synonyme de {{domxref("window.personalbar")}}</dd> + <dt>{{domxref("Window.document")}} {{ReadOnlyInline}}</dt> + <dd>Renvoie une référence au document que la fenêtre contient.</dd> + <dt>{{domxref("Window.DOMMatrix")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Renvoie une référence à un objet {{domxref("DOMMatrix")}} représentant des matrices 4x4, adapté aux opérations 2D et 3D.</dd> + <dt>{{domxref("Window.DOMMatrixReadOnly")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Renvoie une référence à un objet {{domxref("DOMMatrixReadOnly")}} représentant des matrices 4x4, adapté aux opérations 2D et 3D.</dd> + <dt>{{domxref("Window.DOMPoint")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Renvoie une référence à un objet {{domxref("DOMPoint")}} représentant un point 2D ou 3D dans un système de coordonnées.</dd> + <dt>{{domxref("Window.DOMPointReadOnly")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Renvoie une référence à un objet {{domxref("DOMPointReadOnly")}} représentant un point 2D ou 3D dans un système de coordonnées.</dd> + <dt>{{domxref("Window.DOMQuad")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Renvoie une référence à un objet {{domxref("DOMQuad")}}, qui fournit un objet quadrilatère, c'est-à-dire, ayant quatre coins et quatre côtés.</dd> + <dt>{{domxref("Window.DOMRect")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Returns a reference to a {{domxref("DOMRect")}} object, which represents a rectangle.</dd> + <dt>{{domxref("Window.DOMRectReadOnly")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Renvoie une référence à un objet {{domxref("DOMRectReadOnly")}} représentant un rectangle.</dd> + <dt>{{domxref("Window.frameElement")}} {{readOnlyInline}}</dt> + <dd>Renvoie l'élément dans lequel la fenêtre est intégrée, ou null si la fenêtre n'est pas intégrée.</dd> + <dt>{{domxref("Window.frames")}} {{readOnlyInline}}</dt> + <dd>Renvoie un tableau des sous-cadres dans la fenêtre en cours.</dd> + <dt>{{domxref("Window.fullScreen")}} {{gecko_minversion_inline("1.9")}}</dt> + <dd>Cette propriété indique si la fenêtre est affichée en plein écran ou non.</dd> + <dt>{{domxref("Window.globalStorage")}} {{gecko_minversion_inline("1.8.1")}} {{Non-standard_inline}} {{Obsolete_inline("gecko13")}}</dt> + <dd>Non supporté depuis Gecko 13 (Firefox 13). Utilisez {{domxref("Window.localStorage")}} à la place.<br> + Était : divers objets de stockage utilisés pour stocker des données sur plusieurs pages.</dd> + <dt>{{domxref("Window.history")}} {{ReadOnlyInline}}</dt> + <dd>Retourne une référence à l'objet d'historique.</dd> + <dt>{{domxref("Window.innerHeight")}} {{readOnlyInline}}</dt> + <dd>Récupère la hauteur de la zone de contenu de la fenêtre du navigateur, y compris, si affichée, la barre de défilement horizontale.</dd> + <dt>{{domxref("Window.innerWidth")}} {{readOnlyInline}}</dt> + <dd>Récupère la largeur de la zone de contenu de la fenêtre du navigateur, y compris, si affichée, la barre de défilement verticale.</dd> + <dt>{{domxref("Window.isSecureContext")}} {{readOnlyInline}}</dt> + <dd>Indique si un contexte est capable d'utiliser des fonctionnalités nécessitant des contextes sécurisés.</dd> + <dt>{{domxref("Window.length")}} {{readOnlyInline}}</dt> + <dd>Renvoie le nombre de cadres dans la fenêtre. Voir également {{domxref("window.frames")}}.</dd> + <dt>{{domxref("Window.location")}}</dt> + <dd>Récupère/définit l'emplacement, ou l'URL en cours, de l'objet de fenêtre.</dd> + <dt>{{domxref("Window.locationbar")}} {{ReadOnlyInline}}</dt> + <dd>Renvoie l'objet de la barre d'adresse, dont la visibilité peut être inversée dans la fenêtre.</dd> + <dt>{{domxref("Window.localStorage")}} {{readOnlyInline}}{{gecko_minversion_inline("1.9.1")}}</dt> + <dd>Renvoie une référence à l'objet de stockage local utilisé pour stocker les données accessibles uniquement par l'origine qui les a créées.</dd> + <dt>{{domxref("Window.menubar")}} {{ReadOnlyInline}}</dt> + <dd>Renvoie l'objet barre de menus, dont la visibilité peut être inversée dans la fenêtre.</dd> + <dt>{{domxref("Window.messageManager")}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Renvoie l'objet <a href="/fr-FR/docs/The_message_manager">gestionnaire de messages</a> pour cette fenêtre.</dd> + <dt>{{domxref("Window.mozAnimationStartTime")}} {{ReadOnlyInline}}{{gecko_minversion_inline("2.0")}} {{Deprecated_inline}}</dt> + <dd>Le temps en millisecondes depuis l'instant auquel le cycle d'animation en cours a commencé.</dd> + <dt>{{domxref("Window.mozInnerScreenX")}} {{ReadOnlyInline}}{{non-standard_inline}}{{gecko_minversion_inline("1.9.2")}}</dt> + <dd>Renvoie la coordonnée horizontale (X) du coin supérieur gauche du point de vue de la fenêtre, en coordonnées d'écran. Cette valeur est restituée en pixels CSS. Voir <code>mozScreenPixelsPerCSSPixel</code> dans {{interface("nsIDOMWindowUtils")}} pour un facteur de conversion pour s'adapter aux pixels de l'écran si nécessaire.</dd> + <dt>{{domxref("Window.mozInnerScreenY")}} {{ReadOnlyInline}} {{non-standard_inline}}{{gecko_minversion_inline("1.9.2")}}</dt> + <dd>Renvoie la coordonnée verticale (Y) du coin supérieur gauche du point de vue de la fenêtre, en coordonnées d'écran. Cette valeur est indiquée en pixels CSS. Voir <code>mozScreenPixelsPerCSSPixel</code> pour un facteur de conversion pour s'adapter aux pixels de l'écran si nécessaire.</dd> + <dt>{{domxref("Window.mozPaintCount")}} {{non-standard_inline}}{{ReadOnlyInline}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Renvoie le nombre de fois où le document en cours a été réaffiché à l'écran dans cette fenêtre. Cela peut être utilisé pour calculer les performances d'affichage.</dd> + <dt>{{domxref("Window.name")}}</dt> + <dd>Récupère / définit le nom de la fenêtre.</dd> + <dt>{{domxref("Window.navigator")}} {{readOnlyInline}}</dt> + <dd>Renvoie une référence à l'objet navigateur.</dd> + <dt>{{domxref("Window.NetworkInformation")}} {{readOnlyInline}} {{experimental_inline}}</dt> + <dd>Renvoie une référence à l'interface {{domxref("NetworkInformation")}}, qui fournit des informations sur la connexion qu'un périphérique est en train d'utiliser pour communiquer avec le réseau et fournit un moyen pour les scripts d'être notifiés si le type de connexion change. </dd> + <dt>{{domxref("Window.opener")}}</dt> + <dd>Renvoie une référence à la fenêtre qui a ouvert la fenêtre en cours.</dd> + <dt>{{domxref("Window.orientation")}}{{non-standard_inline}}{{deprecated_inline}}{{readOnlyInline}}</dt> + <dd>Renvoie l'orientation en degrés (par incréments de 90 degrés) du point de vue par rapport à l'orientation naturelle du périphérique.</dd> + <dt>{{domxref("Window.outerHeight")}} {{readOnlyInline}}</dt> + <dd>Récupère la hauteur de l'extérieur de la fenêtre du navigateur.</dd> + <dt>{{domxref("Window.outerWidth")}} {{readOnlyInline}}</dt> + <dd>Récupère la largeur de l'extérieur de la fenêtre du navigateur.</dd> + <dt>{{domxref("Window.scrollX","Window.pageXOffset")}} {{readOnlyInline}}</dt> + <dd>Un alias pour {{domxref("window.scrollX")}}.</dd> + <dt>{{domxref("Window.scrollY","Window.pageYOffset")}}{{readOnlyInline}}</dt> + <dd>Un alias pour {{domxref("window.scrollY")}}</dd> + <dt>{{domxref("Window.sessionStorage")}} {{readOnlyInline}}</dt> + <dd>Renvoie une référence à l'objet de stockage de session utilisé pour stocker les données accessibles uniquement par l'origine qui les a créées..</dd> + <dt>{{domxref("Window.parent")}} {{readOnlyInline}}</dt> + <dd>Renvoie une référence au parent de la fenêtre ou du sous-cadre en cours.</dd> + <dt>{{domxref("Window.performance")}} {{readOnlyInline}}</dt> + <dd>Renvoie un objet {{domxref("Performance")}}, qui inclut les attributs {{domxref("Performance.timing", "timing")}} et {{domxref("Performance.navigation", "navigation")}}, dont chacun est un objet fournissant des données liées aux performances. Voir aussi <a href="/fr-FR/docs/Web/API/Navigation_timing_API/Using_Navigation_Timing">Utilisation de Chronométrage de Navigation</a> pour plus d'informations et d'exemples.</dd> + <dt>{{domxref("Window.personalbar")}} {{readOnlyInline}}</dt> + <dd>Renvoie l'objet barre personnelle, dont la visibilité peut être inversée dans la fenêtre.</dd> + <dt>{{domxref("Window.pkcs11")}} {{obsolete_inline(29)}}</dt> + <dd>Fournissait précédemment un accès pour installer et supprimer des modules PKCS11.</dd> + <dt>{{domxref("Window.returnValue")}} {{Fx_minversion_inline(3)}}</dt> + <dd>La valeur de retour à renvoyer à la fonction qui a appelé {{domxref("window.showModalDialog()")}} pour afficher la fenêtre comme boîte de dialogue modale.</dd> + <dt>{{domxref("Window.screen")}} {{readOnlyInline}}</dt> + <dd>Renvoie une référence à l'objet écran associé à la fenêtre.</dd> + <dt>{{domxref("Window.screenX")}} {{readOnlyInline}}</dt> + <dd>Renvoie la distance horizontale de la bordure gauche du navigateur de l'utilisateur à partir du côté gauche de l'écran.</dd> + <dt>{{domxref("Window.screenY")}} {{readOnlyInline}}</dt> + <dd>Renvoie la distance verticale de la bordure supérieure du navigateur de l'utilisateur à partir du haut de l'écran.</dd> + <dt>{{domxref("Window.scrollbars")}} {{readOnlyInline}}</dt> + <dd>Renvoie l'objet barres de défilement, dont la visibilité peut être modifiée dans la fenêtre.</dd> + <dt>{{domxref("Window.scrollMaxX")}}{{non-standard_inline}}{{ReadOnlyInline}}</dt> + <dd>Le décalage maximal dont la fenêtre peut étre décalée horizontalement, c'est-à-dire la largeur du document moins la largeur du point de vue.</dd> + <dt>{{domxref("Window.scrollMaxY")}}{{non-standard_inline}}{{ReadOnlyInline}}</dt> + <dd>Le décalage maximal dont la fenêtre peut étre décalée verticalement (c'est-à-dire, la hauteur du document moins la hauteur du point de vue).</dd> + <dt>{{domxref("Window.scrollX")}} {{readOnlyInline}}</dt> + <dd>Renvoie le nombre de pixels dont le document a déjà été décalé horizontalement.</dd> + <dt>{{domxref("Window.scrollY")}} {{readOnlyInline}}</dt> + <dd>Renvoie le nombre de pixels dont le document a déjà été décalé verticalement.</dd> + <dt>{{domxref("Window.self")}} {{ReadOnlyInline}}</dt> + <dd>Renvoie une référence d'objet à l'objet fenêtre lui-même.</dd> + <dt>{{domxref("Window.sessionStorage")}} {{Fx_minversion_inline("2.0")}}</dt> + <dd>Renvoie un objet de stockage pour stocker des données dans une session de page unique.</dd> + <dt>{{domxref("Window.sidebar")}} {{non-standard_inline}}{{ReadOnlyInline}}</dt> + <dd>Renvoie une référence à l'objet fenêtre de la barre latérale.</dd> + <dt>{{domxref("Window.speechSynthesis")}} {{ReadOnlyInline}}</dt> + <dd>Renvoie un objet {{domxref("SpeechSynthesis")}}, qui est le point d'entrée pour l'utilisation de la fonctionnalité de synthèse vocale de l'<a href="/fr-FR/docs/Web/API/Web_Speech_API">API Web Speech</a>.</dd> + <dt>{{domxref("Window.status")}}</dt> + <dd>Récupère/définit le texte dans la barre d'état en bas du navigateur.</dd> + <dt>{{domxref("Window.statusbar")}} {{readOnlyInline}}</dt> + <dd>Renvoie l'objet barre d'état, dont la visibilité peut être inversée dans la fenêtre.</dd> + <dt>{{domxref("Window.toolbar")}} {{readOnlyInline}}</dt> + <dd>Renvoie l'objet barre d'outils, dont la visibilité peut être inversée dans la fenêtre.</dd> + <dt>{{domxref("Window.top")}} {{readOnlyInline}}</dt> + <dd>Renvoie une référence à la fenêtre la plus haute dans la hiérarchie des fenêtres. Cette propriété est en lecture seule.</dd> + <dt>{{domxref("Window.visualViewport")}} {{readOnlyInline}}</dt> + <dd>Renvoie un objet {{domxref("VisualViewport")}} représentant le point de vue visuel pour une fenêtre donnée.</dd> + <dt>{{domxref("Window.window")}} {{ReadOnlyInline}}</dt> + <dd>Renvoie une référence à la fenêtre en cours.</dd> + <dt><code>window[0]</code>,<code> window[1]</code>, etc.</dt> + <dd>Renvoie une référence à l'objet <code>window</code> dans les cadres. Voir {{domxref("Window.frames")}}} pour plus de détails.</dd> +</dl> + +<h3 id="Propriétés_implémentées_depuis_ailleurs">Propriétés implémentées depuis ailleurs</h3> + +<dl> + <dt>{{domxref("WindowOrWorkerGlobalScope.caches")}} {{readOnlyinline}}</dt> + <dd>Renvoie l'objet {{domxref("CacheStorage")}} associé au contexte en cours. Cet objet active des fonctionnalités telles que le stockage des ressources pour une utilisation hors connexion, et la génération de réponses personnalisées aux requêtes.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.indexedDB")}} {{readonlyInline}}</dt> + <dd>Fournit un mécanisme permettant aux applications d'accéder de manière asynchrone à des bases de données indexées ; renvoie un objet {{domxref("IDBFactory")}}.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.isSecureContext")}} {{readOnlyinline}}</dt> + <dd>Renvoie un booléen indiquant si le contexte actuel est sécurisé (<code>true</code>) ou non (<code>false</code>).</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.origin")}} {{readOnlyinline}}</dt> + <dd>Renvoie l'origine de l'objet global, sérialisé comme une chaîne. (Cela ne semble pas encore être implémenté dans aucun navigateur.)</dd> +</dl> + +<h2 id="M.C3.A9thodes" name="M.C3.A9thodes">Méthodes</h2> + +<p><em>Cette interface hérite des méthodes de l'interface {{domxref("EventTarget")}} et implémente les méthodes de {{domxref("WindowOrWorkerGlobalScope")}} et {{domxref("EventTarget")}}.</em></p> + +<dl> + <dt>{{domxref("Window.alert()")}}</dt> + <dd>Affiche une boîte de message d'alerte.</dd> +</dl> + +<p><span class="comment">base64 func <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=287112" rel="freelink">https://bugzilla.mozilla.org/show_bug.cgi?id=287112</a> (see last comments) <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=123003" rel="freelink">https://bugzilla.mozilla.org/show_bug.cgi?id=123003</a> <a class="external" href="http://lxr.mozilla.org/seamonkey/source/dom/src/base/nsGlobalWindow.cpp#4946" rel="freelink">http://lxr.mozilla.org/seamonkey/sou...indow.cpp#4946</a></span></p> + +<dl> + <dt>{{domxref("Window.back()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Recule d'une page dans l'historique de la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.blur()")}}</dt> + <dd>Déplace la focalisation hors de la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.cancelAnimationFrame()")}} {{experimental_inline}}</dt> + <dd>Vous permet d'annuler un rappel précédemment planifié avec {{domxref("Window.requestAnimationFrame")}}.</dd> + <dt>{{domxref("Window.cancelIdleCallback()")}} {{experimental_inline}}</dt> + <dd>Vous permet d'annuler un rappel précédemment planifié avec {{domxref("Window.requestIdleCallback")}}.</dd> + <dt>{{domxref("Window.captureEvents()")}} {{Deprecated_inline}}</dt> + <dd>Enregistre la fenêtre pour qu'elle capture tous les évènements du type spécifié.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.clearImmediate()")}}</dt> + <dd>Annule l'exécution répétée définie en utilisant <code>setImmediate</code>.</dd> + <dt>{{domxref("Window.close()")}}</dt> + <dd>Ferme la fenêtre en cours.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.confirm()")}}</dt> + <dd>Affiche une boîte de dialogue avec un message auquel l'utilisateur doit répondre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.disableExternalCapture()")}} {{obsolete_inline(24)}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.dispatchEvent()")}}</dt> + <dd>Utilisé pour déclencher un évènement.</dd> + <dt>{{domxref("Window.dump()")}} {{Non-standard_inline}}</dt> + <dd>Écrit un message à la console.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.enableExternalCapture()")}} {{obsolete_inline(24)}}</dt> + <dd>{{todo("NeedsContents")}}</dd> +</dl> + +<dl> + <dt>{{domxref("Window.find()")}}</dt> + <dd>Recherche la chaîne de caractères donnée dans une fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.focus()")}}</dt> + <dd>Donne la focalisation à la fenêtre en cours.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.forward()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Avance la fenêtre d'un document dans l'historique.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.getAttention()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Fait flasher l'icône de l'application.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.getAttentionWithCycleCount()")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.getComputedStyle()")}}</dt> + <dd>Récupère un style calculé pour l'élément donné. Un style calculé indique les valeurs de toutes les propriétés CSS de l'élément.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.getDefaultComputedStyle()")}} {{Non-standard_inline}}</dt> + <dd>Récupère le style calculé par défaut pour l'élément indiqué, en ignorant les feuilles de style d'auteur.</dd> + <dt>{{domxref("Window.getSelection()")}}</dt> + <dd>Renvoie l'objet de sélection représentant les éléments sélectionnés.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.home()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Renvoie le navigateur à la page d'accueil.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.matchMedia()")}} {{gecko_minversion_inline("6.0")}}</dt> + <dd>Renvoie un objet {{domxref("MediaQueryList")}} représentant la chaîne d'interrogation de média spécifiée.</dd> + <dt>{{domxref("Window.maximize()")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.minimize()")}} (top-level XUL windows only)</dt> + <dd>Minimize la fenêtre.</dd> + <dt>{{domxref("Window.moveBy()")}}</dt> + <dd>Déplace la fenêtre en cours de la quantité indiquée.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.moveTo()")}}</dt> + <dd>Déplace la fenêtre vers les coordonnées spécifiées.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.open()")}}</dt> + <dd>Ouvre une nouvelle fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.openDialog()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>Ouvre une nouvelle fenêtre de dialogue.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.postMessage()")}} {{Fx_minversion_inline(3)}}</dt> + <dd>Fournit un moyen sécurisé pour une fenêtre d'envoyer une chaîne de données à une autre fenêtre, qui n'a pas besoin d'être dans le même domaine que la première.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.prompt()")}}</dt> + <dd>Ouvre la boîte de dialogue d'impression du document en cours.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.prompt()")}}</dt> + <dd>Renvoie le texte saisi par l'utilisateur dans une boîte de dialogue à invite.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.releaseEvents()")}} {{Non-standard_inline}} {{Deprecated_inline}}</dt> + <dd>Annule la capture des évènements d'un certain type par la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.requestAnimationFrame()")}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Indique au navigateur qu'une animation est en cours, en demandant au navigateur de planifier une redessinage de la fenêtre lors de l'image d'animation suivante.</dd> + <dt>{{domxref("Window.requestIdleCallback()")}} {{experimental_inline}}</dt> + <dd>Active la planification de tâches pendant les périodes d'inactivité du navigateur.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.resizeBy()")}}</dt> + <dd>Redimensionne la fenêtre en cours d'une certaine quantité.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.resizeTo()")}}</dt> + <dd>Redimensionne dynamiquement la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.restore()")}} {{Non-standard_inline}} {{obsolete_inline}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.routeEvent()")}} {{obsolete_inline(24)}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.scroll()")}}</dt> + <dd>Fait défiler la fenêtre à un endroit particulier dans le document.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.scrollBy()")}}</dt> + <dd>Fait défiler le document dans la fenêtre de la quantité indiquée.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.scrollByLines()")}} {{Non-standard_inline}}</dt> + <dd>Fait défiler le document du nombre de lignes indiqué.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.scrollByPages()")}} {{Non-standard_inline}}</dt> + <dd>Fait défiler le document en cours du nombre de pages indiqué.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.scrollTo()")}}</dt> + <dd>Fait défiler à un jeu de coordonnées particulier dans le document.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.setCursor()")}} {{Non-standard_inline}} (top-level XUL windows only)</dt> + <dd>Change le curseur pour la fenêtre en cours.</dd> + <dt>{{domxref("Window.setImmediate()")}}</dt> + <dd>Exécute une fonction après que le navigateur a terminé d'autres tâches lourdes</dd> + <dt>{{domxref("Window.setResizable()")}} {{Non-standard_inline}}</dt> + <dd>Inverse la possibilité pour un utilisateur de redimensionner une fenêtre.</dd> + <dt>{{domxref("Window.sizeToContent()")}} {{Non-standard_inline}}</dt> + <dd>Dimensionne la fenêtre en fonction de son contenu.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.stop()")}}</dt> + <dd>Cette méthode arrête le chargement de la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.updateCommands()")}} {{Non-standard_inline}}</dt> + <dd>Met à jour l'état des commandes de la fenêtre chrome en cours (IU).</dd> + <dt> + <h3 id="Méthodes_implémentées_depuis_ailleurs">Méthodes implémentées depuis ailleurs</h3> + </dt> + <dt>{{domxref("EventTarget.addEventListener()")}}</dt> + <dd>Enregistre un gestionnaire d'événement pour un type d'événement spécifique dans la fenêtre.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.atob()")}}</dt> + <dd>Décode une chaîne de données qui a été codée en utilisant l'encodage en base 64.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.btoa()")}}</dt> + <dd>Crée une chaîne ASCII codée en base 64 à partir d'une chaîne de données binaires.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.clearInterval()")}}</dt> + <dd>Annule l'exécution répétée définie en utilisant {{domxref("WindowOrWorkerGlobalScope.setInterval ()")}}.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.clearTimeout()")}}</dt> + <dd>Annule l'exécution différée définie en utilisant {{domxref("WindowOrWorkerGlobalScope.setTimeout ()")}}.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.createImageBitmap()")}}</dt> + <dd>Accepte une variété de sources d'images différentes, et renvoie un {{domxref("Promise")}} qui se résout en une {{domxref("ImageBitmap")}}. En option, la source est détourée avec le rectangle des pixels d'origine en (sx, sy) et de largeur sw, et de hauteur sh.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.fetch()")}}</dt> + <dd>Démarre le processus de récupération d'une ressource à partir du réseau.</dd> + <dt>{{domxref("EventTarget.removeEventListener")}}</dt> + <dd>Supprime un gestionnaire d'événement de la fenêtre.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.setInterval()")}}</dt> + <dd>Planifie une fonction à exécuter à chaque fois qu'un nombre donné de millisecondes s'est écoulé.</dd> + <dt>{{domxref("WindowOrWorkerGlobalScope.setTimeout()")}}</dt> + <dd>Planifie une fonction à exécuter dans un laps de temps donné.</dd> + <dt> + <h3 id="Méthodes_obsolètes">Méthodes obsolètes</h3> + </dt> + <dt>{{domxref("Window.showModalDialog()")}} {{obsolete_inline}}</dt> + <dd>Affiche un dialogue modal. <strong>Cette méthode a été complètement supprimée dans Chrome 43, et dans Firefox 55</strong>.</dd> +</dl> + +<h2 id=".C3.89v.C3.A8nements" name=".C3.89v.C3.A8nements">Gestionnaires d'évènements</h2> + +<p>Ce sont des propriétés de l'objet window qui peuvent être définies pour établir des gestionnaires d'événements pour les différentes choses qui peuvent se produire dans la fenêtre et qui pourraient être intéressantes.</p> + +<p><em>Cette interface hérite des gestionnaires d'événements de l'interface {{domxref("EventTarget")}} et elle implémente les gestionnaires d'événements de {{domxref("WindowEventHandlers")}}.</em></p> + +<div class="note"> +<p><strong>Note :</strong> à partir de {{Gecko ("9.0")}}, vous pouvez maintenant utiliser la syntaxe <code>if ("onabort" in window)</code> pour déterminer si une propriété de gestionnaire d'événements donnée existe ou non. Cela est dû au fait que les interfaces du gestionnaire d'événements ont été mises à jour pour être des interfaces Web IDL correctes. Voir les gestionnaires d'événements DOM pour plus de détails.</p> +</div> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onabort")}}</dt> + <dt> </dt> + <dd>Appelé quand le chargement d'une ressource a été avorté, comme par le fait qu'un utilisateur annule un chargement alors qu'il était encore en cours.</dd> +</dl> + +<dl> + <dt>{{domxref("WindowEventHandlers.onafterprint")}}</dt> + <dd>Appelé lorsque la boîte de dialogue d'impression est fermée. Voir l'événement {{event ("afterprint")}}.</dd> + <dt>{{domxref("WindowEventHandlers.onbeforeprint")}}</dt> + <dd>Appelé lorsque la boîte de dialogue d'impression est ouverte. Voir l'événement {{event ("beforeprint")}}.</dd> + <dt>{{domxref("Window.onbeforeinstallprompt")}}</dt> + <dd>Propriété de gestionnaire d'événements qui est déclenchée avant qu'un utilisateur ne soit invité à enregistrer un site Web sur un écran d'accueil sur mobile.</dd> + <dt>{{domxref("WindowEventHandlers.onbeforeunload")}}</dt> + <dd>Propriété de gestionnaire d'événements pour les événements avant-déchargement dans la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onblur")}}</dt> + <dd>Appelé après que la fenêtre a perdu la focalisation, comme en raison d'une fenêtre contextuelle.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onchange")}}</dt> + <dd>Propriété de gestionnaire d'événements pour les événements de changement dans la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onclick")}}</dt> + <dd>Appelé après qu'un QUELCONQUE bouton de la souris est pressé & relâché.</dd> +</dl> + +<dl> + <dt>{domxref("GlobalEventHandlers.ondblclick")}}</dt> + <dd>Appelé quand un double clic est fait avec un QUELCONQUE bouton de la souris.</dd> + <dt>{{domxref("GlobalEventHandlers.onclose")}}</dt> + <dd>Appelé après la fermeture de la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.oncontextmenu")}}</dt> + <dd>Appelé lorsque le bouton DROIT de la souris est enfoncé.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.ondevicelight")}}</dt> + <dd>Propriété de gestionnaire d'événements pour tous les changements de niveaux de luminosité ambiante.</dd> + <dt>{{domxref("Window.ondevicemotion")}} {{gecko_minversion_inline("6.0")}}</dt> + <dd>Appelé si l'accéléromètre détecte un changement (pour les appareils mobiles).</dd> + <dt>{{domxref("Window.ondeviceorientation")}} {{gecko_minversion_inline("6.0")}}</dt> + <dd>Appelé lorsque l'orientation est modifiée (pour les appareils mobiles).</dd> + <dt>{{domxref("Window.ondeviceorientationabsolute")}} {{non-standard_inline}} Chrome only</dt> + <dd>Propriété de gestionnaire d'événements pour tout changement d'orientation de l'appareil.</dd> + <dt>{{domxref("Window.ondeviceproximity")}}</dt> + <dd>Propriété de gestionnaire d'événement pour l'événement de proximité de l'appareil.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onerror")}}</dt> + <dd>Appelé lorsqu'une ressource ne se charge pas OU lorsqu'une erreur se produit lors de l'exécution. Voir l'événement {{event("error")}}.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onfocus")}}</dt> + <dd>Appelé après que la fenêtre a reçu ou récupéré la focalisation. Voir les événements {{event("focus")}}.</dd> +</dl> + +<dl> + <dt>{{domxref("WindowEventHandlers.onhashchange")}} {{gecko_minversion_inline("1.9.2")}}</dt> + <dd>Propriété de gestionnaire d'événements pour les événements {{event('hashchange')}} dans la fenêtre ; appelé lorsque la partie de l'URL après la marque hash ("#") change.</dd> + <dt>{{domxref("Window.onappinstalled")}}</dt> + <dd>Appelé lorsque la page est installée en tant que webapp. Voir l'événement {{event('appinstalled')}}.</dd> + <dt>{{domxref("Window.ongamepadconnected")}}</dt> + <dd>Représente un gestionnaire d'événements qui sera exécuté lorsqu'une manette de jeu est branchée (lorsque l'événement {{event('gamepadconnected')}} se déclenche).</dd> + <dt>{{domxref("Window.ongamepaddisconnected")}}</dt> + <dd>Représente un gestionnaire d'événements qui s'exécutera quand une manette de jeu est débranchée (lorsque l'événement {{event('gamepaddisconnected')}} se déclenche).</dd> + <dt>{{domxref("Window.oninput")}}</dt> + <dd>Appelée lorsque la valeur d'un élément <input> change.</dd> + <dt>{{domxref("GlobalEventHandlers.onkeydown")}}</dt> + <dd>Appelé lorsque vous commencez à presser une touche QUELCONQUE. Voir l'événement {{event("keydown")}}.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onkeypress")}}</dt> + <dd>Appelé lorsqu'une touche (à l'exception de Shift, Fn et CapsLock) est en position pressée. Voir l'événement {{event("keypress")}}.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onkeyup")}}</dt> + <dd>Appelé lorsque vous avez fini de relâcher une touche QUELCONQUE. Voir l'événement {{event("keyup")}}.</dd> +</dl> + +<dl> + <dt>{{domxref("WindowEventHandlers.onlanguagechange")}}</dt> + <dd>Propriété de gestionnaire d'événements pour les événements {{event("languagechange")}} dans la fenêtre.</dd> + <dt>{{domxref("GlobalEventHandlers.onload")}}</dt> + <dd>Appelé après que toutes les ressources et les DOM ont été entièrement chargés. NE SERA PAS appelé lorsque la page est chargée à partir du cache, comme avec le bouton arrière.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onmousedown")}}</dt> + <dd>Appelé quand un bouton QUELCONQUE de la souris est pressé.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onmousemove")}}</dt> + <dd>Appelé en continu quand la souris est déplacée dans la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onmouseout")}}</dt> + <dd>Appelé lorsque le pointeur quitte la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onmouseover")}}</dt> + <dd>Appelé lorsque le pointeur entre dans la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onmouseup")}}</dt> + <dd>Appelé quand un bouton QUELCONQUE de la souris est relâché.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.onmozbeforepaint")}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Propriété de gestionnaire d'événements pour l'événement MozBeforePaint, qui est déclenché avant de repeindre la fenêtre si l'événement a été demandé par un appel à la méthode {{domxref("Window.mozRequestAnimationFrame()")}}.</dd> + <dt>{{domxref("WindowEventHandlers.onoffline")}}</dt> + <dd>Appelé lorsque la connexion réseau est perdue. Voir l'événement {{event("offline")}}.</dd> + <dt>{{domxref("WindowEventHandlers.ononline")}}</dt> + <dd>Appelé lorsque la connexion réseau est établie. Voir l'événement {{event("online")}}.</dd> + <dt>{{domxref("WindowEventHandlers.onpagehide")}}</dt> + <dd>Appelé lorsque l'utilisateur quitte la page, avant l'événement onunload. Voir l'événement {{event("pagehide")}}.</dd> + <dt>{{domxref("WindowEventHandlers.onpageshow")}}</dt> + <dd>Appelé après toutes les ressources et les DOM ont été entièrement chargés. Voir l'événement {{event("pageshow")}}.</dd> + <dt>{{domxref("Window.onpaint")}}</dt> + <dd>Propriété de gestionnaire d'évènement pour les évènements de dessin de la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("WindowEventHandlers.onpopstate")}} {{gecko_minversion_inline("2.0")}}</dt> + <dd>Appelé quand le bouton arrière est pressé.</dd> + <dt>{{domxref("Window.onrejectionhandled")}} {{experimental_inline}}</dt> + <dd>Gestionnaire d'événements pour les événements de rejet {{jsxref("Promise")}} gérés.</dd> + <dt>{{domxref("GlobalEventHandlers.onreset")}}</dt> + <dd>Appelé lorsqu'un formulaire est réinitialisé</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onresize")}}</dt> + <dd>Appelé en continu lorsque vous redimensionnez la fenêtre.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onscroll")}}</dt> + <dd>Appelé lorsque la barre de défilement est déplacée par un moyen QUELCONQUE. Si la ressource correspond entièrement à la fenêtre, cet événement ne peut pas être invoqué.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onwheel")}}</dt> + <dd>Appelé lorsque la roue de la souris est tournée autour d'un axe quelconque.</dd> + <dt>{{domxref("GlobalEventHandlers.onselect")}}</dt> + <dd>Appelé après le texte dans un champ de saisie est sélectionné.</dd> +</dl> + +<dl> + <dt>{{domxref("GlobalEventHandlers.onselectionchange")}}</dt> + <dd>Est un {{domxref("EventHandler")}} représentant le code à appeler lorsque l'événement {{event("selectionchange")}} est déclenché.</dd> + <dt>{{domxref("WindowEventHandlers.onstorage")}}</dt> + <dd>Appelé en cas de changement dans le stockage de session ou le stockage local. Voir l'événement {{event("storage")}}.</dd> + <dt>{{domxref("GlobalEventHandlers.onsubmit")}}</dt> + <dd>Appelé lorsqu'un formulaire est soumis.</dd> +</dl> + +<dl> + <dt>{{domxref("WindowEventHandlers.onunhandledrejection")}} {{experimental_inline}}</dt> + <dd>Gestionnaire d'événements pour les événements de rejet {{jsxref("Promise")}} non gérés.</dd> + <dt>{{domxref("WindowEventHandlers.onunload")}}</dt> + <dd>Appelé lorsque l'utilisateur quitte la page.</dd> +</dl> + +<dl> + <dt>{{domxref("Window.onuserproximity")}}</dt> + <dd>Propriété de gestionnaire d'événements pour les événements de proximité d'utilisateur.</dd> + <dt>{{domxref("Window.onvrdisplayconnect")}}</dt> + <dd>Représente un gestionnaire d'événements qui s'exécutera lorsqu'un périphérique RV compatible a été connecté à l'ordinateur (lorsque l'événement {{event("vrdisplayconnected")}} se déclenche).</dd> + <dt>{{domxref("Window.onvrdisplaydisconnect")}}</dt> + <dd>Représente un gestionnaire d'événements qui s'exécutera lorsqu'un périphérique RV compatible a été déconnecté de l'ordinateur (lorsque l'événement {{event("vrdisplaydisconnected")}} se déclenche).</dd> + <dt>{{domxref("Window.onvrdisplayactivate")}}</dt> + <dd>Représente un gestionnaire d'événements qui s'exécutera lorsqu'un affichage peut être présenté (lorsque l'événement {{event("vrdisplayactivate")}} se déclenche), par exemple si un HMD a été déplacé pour sortir de veille, ou a été réveillé en le mettant sur soi.</dd> + <dt>{{domxref("Window.onvrdisplaydeactivate")}}</dt> + <dd>Représente un gestionnaire d'événements qui s'exécute lorsqu'un affichage ne peut plus être présenté (lorsque l'événement {{event ("vrdisplaydeactivate")}} se déclenche), par exemple si un HMD est passé en veille ou en hibernation en raison d'une période d'inactivité.</dd> + <dt>{{domxref("Window.onvrdisplayblur")}}</dt> + <dd>Représente un gestionnaire d'événements qui s'exécutera lorsque la présentation sur un affichage a été suspendue pour une raison quelconque par le navigateur, le SE ou le matériel de RV (lorsque l'événement {{event("vrdisplayblur")}} se déclenche - par exemple, lorsque l'utilisateur interagit avec un menu système ou un navigateur, pour empêcher le suivi ou la perte d'expérience.</dd> + <dt>{{domxref("Window.onvrdisplayfocus")}}</dt> + <dd>Représente un gestionnaire d'événements qui sera exécuté lorsque la présentation sur un afficheur a repris après avoir perdu la focalisation (lorsque l'événement {{event("vrdisplayfocus")}} se déclenche).</dd> + <dt>{{domxref("Window.onvrdisplaypresentchange")}}</dt> + <dd>Représente un gestionnaire d'événements qui s'exécute lorsque l'état de présentation d'un périphérique de RV change, c'est-à-dire qu'il passe de présentation à non présentation, ou vice versa (lorsque l'événement {{event("vrdisplaypresentchange")}} se déclenche).</dd> +</dl> + +<h2 id="Constructeurs">Constructeurs</h2> + +<p>Voir aussi les <a href="/fr-FR/docs/DOM/DOM_Reference" title="/en-US/docs/DOM/DOM_Reference">Interfaces DOM</a>.</p> + +<dl> + <dt>{{domxref("DOMParser")}}</dt> + <dd><code>DOMParser</code> peut analyser un source XML ou HTML stocké dans une chaîne de caractères en un <a href="/fr-FR/docs/DOM/document">Document</a> DOM. <code>DOMParser</code> est spécifié dans <a href="https://w3c.github.io/DOM-Parsing/">DOM Parsing et Serialization</a>.</dd> + <dt>{{domxref("Window.GeckoActiveXObject")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Image")}}</dt> + <dd>Used for creating an {{domxref("HTMLImageElement")}}.</dd> + <dt>{{domxref("Option")}}</dt> + <dd>Used for creating an {{domxref("HTMLOptionElement")}}</dd> + <dt>{{domxref("Window.QueryInterface")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.XMLSerializer")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Worker")}}</dt> + <dd>Used for creating a <a href="https://developer.mozilla.org/en-US/docs/DOM/Using_web_workers">Web worker</a></dd> + <dt>{{domxref("Window.XPCNativeWrapper")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> + <dt>{{domxref("Window.XPCSafeJSObjectWrapper")}}</dt> + <dd>{{todo("NeedsContents")}}</dd> +</dl> + +<h2 id="Interfaces">Interfaces</h2> + +<p>Voir <a href="/fr/docs/Web/API/Document_Object_Model">Référence du DOM</a></p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/Mozilla/Working_with_windows_in_chrome_code">Travailler avec des fenêtres dans le code chrome</a></li> +</ul> diff --git a/files/fr/web/api/window/innerheight/index.html b/files/fr/web/api/window/innerheight/index.html new file mode 100644 index 0000000000..6a6c7e8ede --- /dev/null +++ b/files/fr/web/api/window/innerheight/index.html @@ -0,0 +1,147 @@ +--- +title: window.innerHeight +slug: Web/API/Window/innerHeight +tags: + - API + - CSSOM View + - Property + - Propriété + - Reference + - Window +translation_of: Web/API/Window/innerHeight +--- +<p>{{ ApiRef() }}</p> + +<p id="R.C3.A9sum.C3.A9">Récupère la hauteur (en pixels) de la partie visible de la fenêtre de navigation en incluant, si elle est affichée, la barre de défilement horizontale.</p> + +<div class="note"> +<p><strong>Note :</strong> La valeur retournée par cette propriété correspond le cas échéant à la hauteur de la fenêtre définie par {{ifmethod("nsIDOMWindowUtils", "setCSSViewport")}}, dans le cas où vous utilisez cette méthode pour définir les dimensions de la fenêtre virtuelle dans le but d'agencer la page.</p> +</div> + +<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> + +<pre>var hauteur = window.innerHeight; +</pre> + +<h3 id="Valeur_renvoy.C3.A9e" name="Valeur_renvoy.C3.A9e">Valeur</h3> + +<p class="syntaxbox">Renvoie la hauteur de la partie visible de la fenêtre de navigation.<br> + La propriété <code>window.innerHeight</code> est accessible en lecture seulement ; elle n'a pas de valeur par défaut.</p> + +<h2 class="syntaxbox" id="Notes">Notes</h2> + +<ul> + <li>La propriété <code>window.innerHeight</code> est supportée par tout objet assimilé à une fenêtre <em>{{domxref("window")}}</em>, un cadre <em>frame </em>, un ensemble de cadres <em>frameset</em>, ou une fenêtre secondaire.</li> + <li>Il existe un <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=189112#c7">algorithme</a> pour calculer la hauteur de la partie visible de la fenêtre en excluant la barre de défilement horizontale si est elle affichée.</li> +</ul> + +<h2 id="Attention" name="Attention">Exemples</h2> + +<h3 id="Code" name="Code">Sur un <em>frameset</em></h3> + +<pre class="brush:js">var intFrameHeight = window.innerHeight; // ou + +var intFrameHeight = self.innerHeight; +// retournera la hauteur de la partie visible du cadre dans frameset + +var intFramesetHeight = parent.innerHeight; +// retournera la hauteur de la partie visible du frameset le plus proche + +var intOuterFramesetHeight = top.innerHeight; +// retournera la hauteur de la partie visible du frameset le plus éloigné +</pre> + +<p>{{todo("ajouter ici un lien vers une démo interactive")}}</p> + +<ul> + <li>Pour modifier les dimensions d'une fenêtre, voir {{domxref("window.resizeBy()")}} et {{domxref("window.resizeTo()")}}.</li> + <li>Pour récupérer la hauteur extérieure d'une fenêtre, c'est-à-dire la hauteur de la fenêtre du navigateur dans sa totalité, voir {{domxref("window.outerHeight")}}.</li> +</ul> + +<h3 id="Exemple_graphique">Exemple graphique</h3> + +<p>L'illustration suivante montre la différence entre <code>outerHeight</code> et <code>innerHeight</code>.<br> + <img alt="outerHeight vs innerHeight" src="/@api/deki/files/213/=FirefoxInnerVsOuterHeight2.png" style="height: 445px; width: 738px;"></p> + +<h2 id="Spécification">Spécification</h2> + +<table> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('CSSOM View', '#dom-window-innerheight', 'window.innerHeight')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatGeckoDesktop(1.0)}}<sup>[1]</sup></td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatGeckoMobile(1.0)}}<sup>[1]</sup></td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Cette propriété était mal gérée dans Firefox versions 4 à 24, et pouvait dans certains cas renvoyer une valeur erronée avant le chargement de la page, voir {{bug(641188)}}.</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("window.innerWidth")}}</li> + <li>{{domxref("window.outerHeight")}}</li> + <li>{{domxref("window.outerWidth")}}</li> +</ul> + +<div class="noinclude"> </div> + +<p>{{ languages( { "fr": "fr/DOM/window.innerHeight", "ja": "ja/DOM/window.innerHeight" } ) }}</p> diff --git a/files/fr/web/api/window/innerwidth/index.html b/files/fr/web/api/window/innerwidth/index.html new file mode 100644 index 0000000000..00047c4566 --- /dev/null +++ b/files/fr/web/api/window/innerwidth/index.html @@ -0,0 +1,109 @@ +--- +title: window.innerWidth +slug: Web/API/Window/innerWidth +translation_of: Web/API/Window/innerWidth +--- +<p>{{ ApiRef() }}</p> + +<h2 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h2> + +<p>Récupère la largeur du contenu visible de la fenêtre de navigation en incluant, s'il est visible, l'ascenseur vertical.<br> + Permet également de fixer une largeur pour le domaine d'affichage de la fenêtre.</p> + +<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> + +<pre>var largeur = window.innerWidth; +</pre> + +<p>Voir aussi : <a href="/fr/docs/Web/API/Window/innerHeight">window.innerHeight</a>, <a href="/fr/docs/Web/API/Window/outerHeight">window.outerHeight</a> and <a href="/fr/docs/Web/API/Window/outerWidth">window.outerWidth</a>.</p> + +<h2 id="Valeur_renvoy.C3.A9e" name="Valeur_renvoy.C3.A9e">Valeur renvoyée</h2> + +<dl> + <dt><code>innerWidth </code></dt> + <dd>un entier (nombre de pixels);</dd> +</dl> + +<h2 id="Notes">Notes</h2> + +<p>La propriété <code>innerWidth</code> est supportée par tous les objet "window" comme par exemple une fenêtre, une frame, un frameset, ou une fenêtre secondaire.</p> + +<h2 id="Example">Example</h2> + +<pre>// Retourne la largeur de la fenêtre +var largeur = window.innerWidth; + +// Retourn la largeur de la fenêtre à l'intérieur d'une "frameset" +var largeur = self.innerWidth; + +// Retourne la largeur de la fenêtre du "frameset" parent +var largeurDeLaFrame = parent.innerWidth; + +// Retourne la largeur de la fenêtre du "frameset" principal +var largeurDuFrameset = top.innerWidth;</pre> + +<p>Pour changer la taille de la fenêtre, voir {{domxref("window.resizeBy")}} and {{domxref("window.resizeTo")}}.</p> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>{{CompatibilityTable}}</p> + +<table> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(1.0)}}<sup>[1]</sup></td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> + +<table> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile(1.0)}}<sup>[1]</sup></td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> + +<p>[1] From Firefox 4 to 24, this property was buggy and could give a wrong value before page load on certain circumstances, see {{bug(641188)}}.</p> + +<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2> + +<p>DOM Level 0. <code>window.innerWidth</code> ne fait partie d'aucune spécification ou recommandation technique du W3C.</p> + +<p> </p> + +<p> </p> + +<div class="noinclude"> </div> + +<p>{{ languages( { "en": "en/DOM/window.innerWidth", "ja": "ja/DOM/window.innerWidth" } ) }}</p> diff --git a/files/fr/web/api/window/issecurecontext/index.html b/files/fr/web/api/window/issecurecontext/index.html new file mode 100644 index 0000000000..af14866f13 --- /dev/null +++ b/files/fr/web/api/window/issecurecontext/index.html @@ -0,0 +1,60 @@ +--- +title: Window.isSecureContext +slug: Web/API/Window/isSecureContext +tags: + - API + - Propriété + - Reference + - Sécurité + - Window +translation_of: Web/API/Window/isSecureContext +--- +<p>{{APIRef}}{{SeeCompatTable}}</p> + +<p>La propriété en lecteur seule <code><strong>window.isSecureContext</strong></code> indique si un contexte est capable d'utiliser des fonctionnalités qui nécessitent des <a href="/en-US/docs/Web/Security/Secure_Contexts">contextes sécurisés</a>.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">var <em>isSecure</em> = window.isSecureContext</pre> + +<h2 id="Exemples">Exemples</h2> + +<h3 id="Détection_des_fonctionnalités">Détection des fonctionnalités</h3> + +<p>Vous pouvez utiliser la détection des fonctionnalités pour vérifier si elles sont dans un contexte sécurisé ou non à l'aide du booléen <code>isSecureContext</code> qui est exposé sur la portée globale.</p> + +<pre class="brush: js notranslate">if (window.isSecureContext) { + // La page est un contexte sécurisé afin que les techniciens de service soient désormais disponibles + navigator.serviceWorker.register("/offline-worker.js").then(function () { + ... + }); +}</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>Spécification</th> + <th>Statut</th> + <th>Commentaire</th> + </tr> + <tr> + <td>{{SpecName('Secure Contexts')}}</td> + <td>{{Spec2('Secure Contexts','#monkey-patching-global-object','isSecureContext')}}</td> + <td>Spécification initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.isSecureContext")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Web/Security/Secure_Contexts">Contextes sécurisés</a></li> +</ul> diff --git a/files/fr/web/api/window/languagechange_event/index.html b/files/fr/web/api/window/languagechange_event/index.html new file mode 100644 index 0000000000..b849cb7590 --- /dev/null +++ b/files/fr/web/api/window/languagechange_event/index.html @@ -0,0 +1,81 @@ +--- +title: 'Window: languagechange event' +slug: Web/API/Window/languagechange_event +tags: + - Evènement + - Expérimentale + - HTML DOM + - Reference + - Window +translation_of: Web/API/Window/languagechange_event +--- +<div>{{APIRef}}</div> + +<p>L'événement <strong><code>languagechange</code></strong> est déclenché sur l'objet d'étendue globale lorsque la langue préférée de l'utilisateur change.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("Event")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td>{{domxref("WindowEventHandlers/onlanguagechange", "onlanguagechange")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<p>Vous pouvez utiliser l'événement <code>languagechange</code> dans une méthode {{domxref("EventTarget/addEventListener", "addEventListener")}} :</p> + +<pre class="brush: js notranslate">window.addEventListener('languagechange', function() { + console.log('languagechange event detected!'); +});</pre> + +<p>Ou utilisez la propriété du gestionnaire d'événements <code><a href="/en-US/docs/Web/API/WindowEventHandlers/onlanguagechange">onlanguagechange</a></code> :</p> + +<pre class="brush: js notranslate">window.onlanguagechange = function(event) { + console.log('languagechange event detected!'); +};</pre> + +<h2 id="Spécification">Spécification</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('HTML WHATWG', 'indices.html#event-languagechange', 'languagechange') }}</td> + <td>{{ Spec2('HTML WHATWG') }}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.languagechange_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("NavigatorLanguage.language", "navigator.language")}}</li> + <li>{{domxref("NavigatorLanguage.languages", "navigator.languages")}}</li> + <li>{{domxref("Navigator")}}</li> + <li>{{domxref("Window.onlanguagechange")}}</li> +</ul> diff --git a/files/fr/web/api/window/length/index.html b/files/fr/web/api/window/length/index.html new file mode 100644 index 0000000000..2980798007 --- /dev/null +++ b/files/fr/web/api/window/length/index.html @@ -0,0 +1,29 @@ +--- +title: Window.length +slug: Web/API/Window/length +translation_of: Web/API/Window/length +--- +<div>{{ ApiRef() }}</div> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>Retourne le nombre de frames (soit des éléments de frame ou iframe) présent sur la page.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><em>nombreDeFrames</em>= window.length; +</pre> + +<ul> + <li><em>nombreDeFrames est égal au nombre de frames présent sur la page.</em></li> +</ul> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush:js">if (window.length) { + // La page contient des frames +}</pre> + +<h2 id="Specification" name="Specification">Specification</h2> + +<p>{{DOM0}}</p> diff --git a/files/fr/web/api/window/localstorage/index.html b/files/fr/web/api/window/localstorage/index.html new file mode 100644 index 0000000000..9c157962c2 --- /dev/null +++ b/files/fr/web/api/window/localstorage/index.html @@ -0,0 +1,95 @@ +--- +title: Window.localStorage +slug: Web/API/Window/localStorage +tags: + - API + - Propriété + - Reference + - Stockage + - Stockage Web + - Window + - WindowLocalStorage + - lecture seule + - localStorage +translation_of: Web/API/Window/localStorage +--- +<p>{{APIRef("Web Storage API")}}</p> + +<p>La propriété <code>localStorage</code> vous permet d'accéder à un objet local {{domxref("Storage")}}. Le <code>localStorage</code> est similaire au <code><a href="/en-US/docs/Web/API/Window.sessionStorage">sessionStorage</a></code>. La seule différence : les données stockées dans le <code>localStorage</code> n'ont pas de délai d'expiration, alors que les données stockées dans le <code>sessionStorage</code> sont nettoyées quand la session navigateur prend fin — donc quand on ferme le navigateur.</p> + +<p>Il convient de noter que les données stockées dans <code>localStorage</code> ou <code>sessionStorage</code> <strong>sont spécifiques au protocole de la page.</strong></p> + +<p>Les clés et les valeurs <strong>sont toujours</strong> <u>des chaînes de caractères</u> (à noter que, comme pour les objets, les clés entières seront automatiquement converties en chaînes de caractères).</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="brush: js">monStockage = localStorage;</pre> + +<h3 id="Valeur">Valeur</h3> + +<p>Un objet {{DOMxRef("Storage")}} qui peut être utilisé pour accéder à l'espace de stockage local de l'origine actuelle.</p> + +<h3 id="Exceptions">Exceptions</h3> + +<dl> + <dt><code>SecurityError</code></dt> + <dd>La demande viole une décision politique, ou l'origine n'est pas <a href="/fr/docs/Web/Security/Same_origin_policy_for_JavaScript">un schéma/hôte/port valide</a> (cela peut se produire si l'origine utilise le shéma <code>file:</code> ou <code>data:</code>, par exemple). Par exemple, l'utilisateur peut configurer son navigateur de manière à refuser la permission de conserver des données pour l'origine spécifiée.</dd> +</dl> + +<h2 id="Exemple">Exemple</h2> + +<p>L'extrait de code suivant accède à l'objet local {{domxref("Storage")}} du domaine courant et lui ajoute une entrée en utilisant {{domxref("Storage.setItem()")}}.</p> + +<pre class="brush: js">localStorage.setItem('monChat', 'Tom');</pre> + +<p>La syntaxe pour la lecture de l'article <code>localStorage</code> est la suivante :</p> + +<pre class="brush: js">var cat = localStorage.getItem('myCat');</pre> + +<p>La syntaxe pour la suppression de l'élément <code>localStorage</code> est la suivante :</p> + +<pre class="brush: js">localStorage.removeItem('myCat');</pre> + +<p>La syntaxe pour supprimer tous les éléments de <code>localStorage</code> est la suivante :</p> + +<pre class="brush: js">// Effacer tous les éléments +localStorage.clear(); +</pre> + +<div class="note"> +<p><strong>Note</strong>: Se référer à l'article <a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a> pour voir un exemple complet.</p> +</div> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName("HTML WHATWG", "webstorage.html#dom-localstorage", "localStorage")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_navigateurs">Compatibilité navigateurs</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.Window.localStorage")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a></li> + <li>{{domxref("Storage/LocalStorage")}}</li> + <li>{{domxref("Window/SessionStorage")}}</li> + <li>{{domxref("Window.sessionStorage")}}</li> +</ul> diff --git a/files/fr/web/api/window/location/index.html b/files/fr/web/api/window/location/index.html new file mode 100644 index 0000000000..f28ec3ddc0 --- /dev/null +++ b/files/fr/web/api/window/location/index.html @@ -0,0 +1,273 @@ +--- +title: window.location +slug: Web/API/window/location +tags: + - DOM + - DOM_0 +translation_of: Web/API/Window/location +--- +<p>Renvoie un objet <code>Location</code> contenant des informations concernant l'URL actuelle du document et fournit des méthodes pour modifier cette URL. Cette propriété peut être utilisée pour charger une autre page.</p> + +<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox"> var adresseActuelle = window.location; + window.location = nouvelleAdresse;</pre> + +<p>où</p> + +<ul> + <li><em>adresseActuelle</em> est un objet de type <code>Location</code>, fournissant des informations à propos de l'URL courante et des méthodes pour la modifier. Ses propriétés et méthodes sont décrites ci-dessous.</li> + <li><em>nouvelleAdresse</em> est un objet <code>Location</code> ou une chaîne de caractères indiquant l'URL à charger.</li> +</ul> + +<h2 id="L.27objet_Location" name="L.27objet_Location">L'objet <code>Location</code></h2> + +<p>Les objets <code>Location</code> ont une méthode <code>toString</code> renvoyant l'URL courante. Il est également possible d'assigner une chaîne à <code>window.location</code>. Cela signifie que <code>window.location</code> peut être utilisé comme s'il s'agissait d'une chaîne dans la plupart des cas. De temps en temps, par exemple pour appeler une méthode d'objet <a href="/fr/R%C3%A9f%C3%A9rence_de_JavaScript_1.5_Core/Objets_globaux/String" title="fr/Référence_de_JavaScript_1.5_Core/Objets_globaux/String">String</a>, il est nécessaire d'appeler explicitement <code>toString</code> :</p> + +<pre class="brush: js">alert(window.location.toString().charAt(17)) +</pre> + +<h2 id="Propri.C3.A9t.C3.A9s" name="Propri.C3.A9t.C3.A9s">Propriétés</h2> + +<p>Toutes les propriétés suivantes sont des chaînes de caractères. Elles peuvent être lues pour obtenir des informations concernant l'URL courante, ou modifiées pour accéder à une autre adresse URL.</p> + +<p>La colonne « Exemple » contient les valeurs de ces propriétés pour l'URL suivante :<span class="nowiki"> http://www.example.com:8080/search?q=devmo#test</span></p> + +<table class="fullwidth-table"> + <tbody> + <tr> + <th>Propriété</th> + <th>Description</th> + <th>Exemple</th> + </tr> + <tr> + <td><a name="hash"><code>hash</code></a></td> + <td>La partie de l'URL qui suit le symbole « # », s'il y en un, avec ce symbole inclus. Une chaîne de caractères vide s'il n'y a pas de symbole #, ou qu'il n'est suivi par rien. Vous pouvez écouter l'<a href="/en-US/docs/Web/Reference/Events/hashchange" title="/en-US/docs/Web/Reference/Events/hashchange">évènement hashchange</a> pour être alerté des changements du hash dans les navigateurs le supportant.</td> + <td>#test</td> + </tr> + <tr> + <td><a name="host"><code>host</code></a></td> + <td>Le nom de l'hôte et son numéro de port.</td> + <td>www.<span class="nowiki">example</span>.com:8080</td> + </tr> + <tr> + <td><a name="hostname"><code>hostname</code></a></td> + <td>Le nom de l'hôte (sans son numéro de port).</td> + <td>www.<span class="nowiki">example</span>.com</td> + </tr> + <tr> + <td><a name="href"><code>href</code></a></td> + <td>L'URL entière.</td> + <td><span class="nowiki">http://www.</span><span class="nowiki">example</span><span class="nowiki">.com:8080/search?q=devmo#test</span></td> + </tr> + <tr> + <td><a name="origin"><code>origin</code></a></td> + <td>L'origine de l'URL</td> + <td><span class="nowiki">http://www.</span><span class="nowiki">example</span><span class="nowiki">.com:8080</span></td> + </tr> + <tr> + <td><a name="pathname"><code>pathname</code></a></td> + <td>Le chemin (relativement à l'hôte).</td> + <td>/search</td> + </tr> + <tr> + <td><a name="port"><code>port</code></a></td> + <td>Le numéro de port de l'URL. Si l'URL n'a pas de port (si le site utilise le port 80, le port par défaut de la plupart des sites), une chaîne de caractères vide est renvoyée.</td> + <td>8080</td> + </tr> + <tr> + <td><a name="protocol"><code>protocol</code></a></td> + <td>Le protocole de l'URL.</td> + <td>http:</td> + </tr> + <tr> + <td><a name="search"><code>search</code></a></td> + <td>La partie de l'URL qui suit le symbole « <code>?</code> », avec ce symbole inclus</td> + <td>?q=devmo</td> + </tr> + </tbody> +</table> + +<h2 id="M.C3.A9thodes" name="M.C3.A9thodes">Méthodes</h2> + +<table class="fullwidth-table"> + <tbody> + <tr> + <th>Méthode</th> + <th>Description</th> + </tr> + <tr> + <td><code>assign(<em>url</em>)</code></td> + <td>Charge le document situé à l'URL spécifiée.</td> + </tr> + <tr> + <td><code>reload(<em>forceget</em>)</code></td> + <td>Recharge le document depuis l'URL actuelle. <code>forceget</code> est une valeur booléenne, qui lorsqu'elle vaut <code>true</code> force la page à être rechargée depuis le serveur. Si elle vaut <code>false</code> ou n'est pas précisée, le navigateur peut recharger la page depuis son cache.</td> + </tr> + <tr> + <td><code>replace(<em>url</em>)</code></td> + <td>Remplace le document courant par celui situé à l'URL fournie. La différence avec la méthode <code>assign()</code> est qu'après un <code>replace()</code>, la page courante ne sera pas enregistrée dans l'historique de la session, ce qui signifie que l'utilisateur ne pourra pas utiliser le bouton « Page précédente » pour y retourner.</td> + </tr> + <tr> + <td><code>toString()</code></td> + <td>Renvoie la représentation sous forme de chaîne de l'URL de l'objet <code>Location</code>. Consultez la <a href="/fr/docs/JavaScript/Référence_JavaScript/Référence_JavaScript/Objets_globaux/Object/toString" title="fr/Référence_de_JavaScript_1.5_Core/Objets_globaux/Object/toString">référence JavaScript</a> pour plus de détails.</td> + </tr> + </tbody> +</table> + +<h2 id="Exemple" name="Exemple">Exemples</h2> + +<h3 id="Exemple_1_Naviguer_vers_une_nouvelle_page">Exemple 1 : Naviguer vers une nouvelle page</h3> + +<p>A chaque fois qu'une nouvelle valeur est assignée à l'objet <code>Location</code>, un document sera chargé en utilisant l'URL fournie, comme si <code>window.location.assign() </code>avait été appelé avec la nouvelle URL.</p> + +<pre class="brush: js">window.location.assign("http://www.mozilla.org"); // ou +window.location = "http://www.mozilla.org"; +</pre> + +<h3 id="Exemple_2_Forcer_le_rechargement_de_la_page_actuelle_depuis_le_serveur">Exemple 2 : Forcer le rechargement de la page actuelle depuis le serveur</h3> + +<pre class="brush: js">window.location.reload(true);</pre> + +<h3 id="Exemple_3_Afficher_les_propriétés_de_l'URL_actuelle_dans_une_fenêtre_d'alerte">Exemple 3 : Afficher les propriétés de l'URL actuelle dans une fenêtre d'alerte</h3> + +<pre class="brush: js">function montrerLoc() { + var oLocation = window.location, aLog = ["Propriété (Typeof): valeur", "window.location (" + (typeof oLocation) + "): " + oLocation ]; + for (var sProp in oLocation){ + aLog.push(sProp + " (" + (typeof oLocation[sProp]) + "): " + (oLocation[sProp] || "n/a")); + } + alert(aLog.join("\n")); +} + +// dans le HTM: <button onclick="montrerLoc();">Montrer les propriétés de Location</button> +</pre> + +<h3 id="Exemple_4_Envoyer_une_chaine_de_données_au_serveur_en_modifiant_la_propriété_search">Exemple 4 : Envoyer une chaine de données au serveur en modifiant la propriété <code>search</code></h3> + +<pre class="brush: js">function envoyerDonnees (sData) { + window.location.search = sData; +} + +// dans le HTML : <button onclick="envoyerDonnees('des infos');">Envoyer des données</button> +</pre> + +<p>L'adresse URL complêtée par "?des%20infos" est envoyée au serveur (si aucune action est prise en charge par le serveur, le document actuel est rechargé avec la nouvelle chaîne de caractère modifié).</p> + +<h3 id="Exemple_5_Obtenir_la_valeur_d'un_paramètre_de_l'URL_par_window.location.search">Exemple 5 : Obtenir la valeur d'un paramètre de l'URL par <code>window.location.search</code></h3> + +<pre class="brush: js">function obtenirParametre (sVar) { + return unescape(window.location.search.replace(new RegExp("^(?:.*[&\\?]" + escape(sVar).replace(/[\.\+\*]/g, "\\$&") + "(?:\\=([^&]*))?)?.*$", "i"), "$1")); +} + +alert(obtenirParametre("nom")); +</pre> + +<h3 id="Exemple_6_Placer_les_valeurs_obtenues_par_window.location.search_dans_un_objet_nommé_oParametres">Exemple 6 : Placer les valeurs obtenues par <code>window.location.search</code> dans un objet nommé <code>oParametres</code></h3> + +<pre class="brush: js">var oParametre = {}; + +if (window.location.search.length > 1) { + for (var aItKey, nKeyId = 0, aCouples = window.location.search.substr(1).split("&"); nKeyId < aCouples.length; nKeyId++) { + aItKey = aCouples[nKeyId].split("="); + oParametre[unescape(aItKey[0])] = aItKey.length > 1 ? unescape(aItKey[1]) : ""; + } +} + +// alert(oParametre.votreValeur); +</pre> + +<p>… la même chose avec un constructeur anonyme :</p> + +<pre class="brush: js">var oParametre = new (function (sRecherche) { + if (sRecherche.length > 1) { + for (var aItKey, nKeyId = 0, aCouples = sRecherche.substr(1).split("&"); nKeyId < aCouples.length; nKeyId++) { + aItKey = aCouples[nKeyId].split("="); + this[unescape(aItKey[0])] = aItKey.length > 1 ? unescape(aItKey[1]) : ""; + } + } +})(window.location.search); + +// alert(oParametre.votreValeur); +</pre> + +<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2> + +<p>{{SpecName("HTML WHATWG", "#the-location-interface")}}</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Support basique</td> + <td>{{ CompatVersionUnknown() }}</td> + <td> + <p>{{ CompatVersionUnknown() }}</p> + </td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + <tr> + <td><code>window.location.origin</code></td> + <td> + <p>{{ CompatVersionUnknown() }}</p> + </td> + <td>{{CompatGeckoDesktop(21)}}</td> + <td>{{CompatUnknown()}}</td> + <td>{{CompatUnknown()}}</td> + <td>{{CompatUnknown()}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Support basique</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + <tr> + <td><code>window.location.origin</code></td> + <td>{{CompatUnknown()}}</td> + <td>{{CompatGeckoMobile(21)}}</td> + <td>{{CompatUnknown()}}</td> + <td>{{CompatUnknown()}}</td> + <td>{{CompatUnknown()}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/fr/docs/Web/Guide/DOM/Manipuler_historique_du_navigateur" title="en/DOM/Manipulating the browser history">Manipuler l'historique du navigateur</a></li> + <li>{{domxref('window.history')}}</li> + <li><a href="/en-US/docs/Web/Reference/Events/hashchange" title="/en-US/docs/DOM/Mozilla_event_reference/hashchange">hashchange</a></li> +</ul> diff --git a/files/fr/web/api/window/locationbar/index.html b/files/fr/web/api/window/locationbar/index.html new file mode 100644 index 0000000000..aa38a49d88 --- /dev/null +++ b/files/fr/web/api/window/locationbar/index.html @@ -0,0 +1,74 @@ +--- +title: Window.locationbar +slug: Web/API/Window/locationbar +tags: + - API + - HTML DOM + - Propriété + - Reference + - Window +translation_of: Web/API/Window/locationbar +--- +<div>{{APIRef}}</div> + +<p>Renvoie l'objet <code>locationbar</code>, dont la visibilité peut être vérifiée.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><var>objRef</var> = window.locationbar +</pre> + +<h2 id="Exemple">Exemple</h2> + +<p>L'exemple HTML complet suivant montre comment la propriété <code>visible</code> de l'objet <code>locationbar</code> est utilisée.</p> + +<pre class="brush:html notranslate"><!DOCTYPE html> +<html lang="fr"> +<head> +<meta charset="UTF-8" /> +<title>Divers tests DOM</title> + +<script> +var visible = window.locationbar.visible; +</script> + +</head> +<body> + <p>Divers tests DOM</p> +</body> +</html> +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaires</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'browsers.html#dom-window-locationbar', 'Window.locationbar')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#dom-window-locationbar', 'Window.locationbar')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez vérifier <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.locationbar")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("window.locationbar")}}, {{domxref("window.menubar")}}, {{domxref("window.personalbar")}}, {{domxref("window.scrollbars")}}, {{domxref("window.statusbar")}}, {{domxref("window.toolbar")}}</li> +</ul> diff --git a/files/fr/web/api/window/matchmedia/index.html b/files/fr/web/api/window/matchmedia/index.html new file mode 100644 index 0000000000..1237675eeb --- /dev/null +++ b/files/fr/web/api/window/matchmedia/index.html @@ -0,0 +1,77 @@ +--- +title: window.matchMedia +slug: Web/API/Window/matchMedia +translation_of: Web/API/Window/matchMedia +--- +<div> + {{ApiRef}}</div> +<h2 id="Summary" name="Summary">Résumé</h2> +<p>Retourne un nouvel objet {{domxref("MediaQueryList")}} contenant les résultats de la chaîne de caractères <a href="/en-US/docs/CSS/Media_queries" title="CSS/Media queries">media query</a> spécifiée.</p> +<h2 id="Syntax" name="Syntax">Syntaxe</h2> +<pre class="syntaxbox"><em>mql</em> = window.matchMedia(<em>mediaQueryString</em>)</pre> +<p>Ici, <code>mediaQueryString</code> est une chaîne de caractère représentant la media query pour laquelle on retourne un nouvel objet {{domxref("MediaQueryList")}}.</p> +<h2 id="Example" name="Example">Exemple</h2> +<pre class="brush: js">if (window.matchMedia("(min-width: 400px)").matches) { + /* the view port is at least 400 pixels wide */ +} else { + /* the view port is less than 400 pixels wide */ +}</pre> +<p>Ce code permet de gérer la mise en page d'une manière différente quand l'écran est moins large.</p> +<p>Voir <a href="/en-US/docs/DOM/Using_media_queries_from_code" title="/en-US/docs/DOM/Using_media_queries_from_code">Utiliser les media queries avec du code</a> pour plus d'exemples.</p> +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité des navigateurs</h2> +<p>{{CompatibilityTable()}}</p> +<div id="compat-desktop"> + <table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>9</td> + <td>{{CompatGeckoDesktop("6.0")}}</td> + <td>10 PP3 {{property_prefix("ms")}}</td> + <td>{{CompatNo()}}</td> + <td>5.1</td> + </tr> + </tbody> + </table> +</div> +<div id="compat-mobile"> + <table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>3.0</td> + <td>{{CompatGeckoMobile("6.0")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>5</td> + </tr> + </tbody> + </table> +</div> +<h2 id="Specification" name="Specification">Spécification</h2> +<ul> + <li><a class="external" href="http://dev.w3.org/csswg/cssom-view/#the-mediaquerylist-interface">The CSSOM View Module: The MediaQueryList Interface</a></li> +</ul> +<h2 id="See_also" name="See_also">Voir aussi</h2> +<ul> + <li><a href="/en-US/docs/CSS/Media_queries" title="CSS/Media queries">Media queries</a></li> + <li><a href="/en-US/docs/DOM/Using_media_queries_from_code" title="CSS/Using media queries from code">Using media queries from code</a></li> + <li>{{domxref("MediaQueryList")}}</li> + <li>{{domxref("MediaQueryListListener")}}</li> +</ul> diff --git a/files/fr/web/api/window/menubar/index.html b/files/fr/web/api/window/menubar/index.html new file mode 100644 index 0000000000..eb2a7337ec --- /dev/null +++ b/files/fr/web/api/window/menubar/index.html @@ -0,0 +1,74 @@ +--- +title: Window.menubar +slug: Web/API/Window/menubar +tags: + - API + - HTML DOM + - Propriété + - Reference + - Window +translation_of: Web/API/Window/menubar +--- +<div>{{ APIRef() }}</div> + +<p>La propriété <code><strong>Window.menubar</strong></code> renvoie l'objet <code>menubar</code>, dont la visibilité peut être vérifiée.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><em>objRef</em> = <em>window</em>.menubar +</pre> + +<h2 id="Exemple">Exemple</h2> + +<p>L'exemple HTML complet suivant montre comment la propriété <code>visible</code> de l'objet <code>menubar</code> est utilisée.</p> + +<pre class="brush:html notranslate"><html> +<head> + <title>Divers Tests DOM</title> + <script> + var visible = window.menubar.visible; + </script> +</head> +<body> + <p>Divers Tests DOM</p> +</body> +</html> +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'browsers.html#dom-window-menubar', 'Window.menubar')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#dom-window-menubar', 'Window.menubar')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.menubar")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("Window.locationbar")}}</li> + <li>{{domxref("Window.personalbar")}}</li> + <li>{{domxref("Window.scrollbars")}}</li> + <li>{{domxref("Window.statusbar")}}</li> + <li>{{domxref("Window.toolbar")}}</li> +</ul> diff --git a/files/fr/web/api/window/message_event/index.html b/files/fr/web/api/window/message_event/index.html new file mode 100644 index 0000000000..4c401afaa8 --- /dev/null +++ b/files/fr/web/api/window/message_event/index.html @@ -0,0 +1,84 @@ +--- +title: 'Window: message event' +slug: Web/API/Window/message_event +tags: + - Evènement + - Window +translation_of: Web/API/Window/message_event +--- +<div>{{APIRef}}</div> + +<p>L'événement <code>message</code> est déclenché sur un objet {{domxref('Window')}} lorsque la fenêtre reçoit un message, par exemple d'un appel a <code><a href="/en-US/docs/Web/API/Window/postMessage">Window.postMessage()</a></code> depuis un autre contexte de navigation.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("MessageEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td><code><a href="/en-US/docs/Web/API/WindowEventHandlers/onmessage">onmessage</a></code></td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<p><span class="tlid-translation translation" lang="fr"><span title="">Supposons qu'un script envoie un message à un contexte de navigation différent, tel qu'un autre </span></span><code><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe"><iframe></a></code>, en utilisant un code comme celui-ci:</p> + +<pre class="brush: js notranslate">const targetFrame = window.top.frames[1]; +const targetOrigin = 'https://exemple.org'; +const windowMessageButton = document.querySelector('#window-message'); + +windowMessageButton.addEventListener('click', () => { + targetFrame.postMessage('bonjour', targetOrigin); +});</pre> + +<p>Le récepteur peut écouter le message en utilisant <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener()</a></code> avec un code comme celui-ci:</p> + +<pre class="brush: js notranslate">window.addEventListener('message', (event) => { + console.log(`Message reçu: ${event.data}`); +});</pre> + +<p>Alternativement l'écouteur peut utiliser la propriété du gestionnaire d'événements <code><a href="/en-US/docs/Web/API/WindowEventHandlers/onmessage">onmessage</a></code>:</p> + +<pre class="brush: js notranslate">window.onmessage = (event) => { + console.log(`Message reçu: ${event.data}`); +};</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'indices.html#event-message')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.message_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>Événements liés: <code><a href="/docs/Web/API/Window/messageerror_event">messageerror</a></code>.</li> + <li><code><a href="/en-US/docs/Web/API/Window/postMessage">Window.postMessage()</a></code>.</li> +</ul> diff --git a/files/fr/web/api/window/messageerror_event/index.html b/files/fr/web/api/window/messageerror_event/index.html new file mode 100644 index 0000000000..9f7cc2a8be --- /dev/null +++ b/files/fr/web/api/window/messageerror_event/index.html @@ -0,0 +1,79 @@ +--- +title: 'Window: messageerror event' +slug: Web/API/Window/messageerror_event +tags: + - API + - Evènement + - Message d'événement + - Reference + - Window +translation_of: Web/API/Window/messageerror_event +--- +<div>{{APIRef}}</div> + +<p>L'événement <code>messageerror</code> est déclenché sur un objet {{domxref('Window')}} lorsqu'il reçoit un message qui ne peut pas être désérialisé.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("MessageEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td>{{domxref("WindowEventHandlers/onmessageerror", "onmessageerror")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<p>Écoutez <code>messageerror</code> en utilisant {{domxref("EventTarget/addEventListener", "addEventListener()")}} :</p> + +<pre class="brush: js notranslate">window.addEventListener('messageerror', (event) => { + console.error(event); +});</pre> + +<p>Idem, mais en utilisant la propriété de gestionnaire d'événements {{domxref("WindowEventHandlers/onmessageerror", "onmessageerror")}} :</p> + +<pre class="brush: js notranslate">window.onmessageerror = (event) => { + console.error(event); +};</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'indices.html#event-messageerror')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.messageerror_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("Window.postMessage()")}}</li> + <li>Événements liés: {{domxref("Window/message_event", "message")}}.</li> +</ul> diff --git a/files/fr/web/api/window/mozanimationstarttime/index.html b/files/fr/web/api/window/mozanimationstarttime/index.html new file mode 100644 index 0000000000..a536dff700 --- /dev/null +++ b/files/fr/web/api/window/mozanimationstarttime/index.html @@ -0,0 +1,41 @@ +--- +title: Window.mozAnimationStartTime +slug: Web/API/Window/mozAnimationStartTime +tags: + - API + - HTML DOM + - Obsolete + - Propriété + - Reference + - Window +translation_of: Web/API/Window/mozAnimationStartTime +--- +<p>{{APIRef("Mozilla Extensions")}}{{Non-standard_Header}}{{Obsolete_Header("Gecko42")}}</p> + +<p>Renvoie l'heure, en millisecondes depuis l'époque, à laquelle les animations ont commencé maintenant doivent être considérées comme ayant commencé. Cette valeur doit être utilisée à la place, par exemple, <code><a href="/en/JavaScript/Reference/Global_Objects/Date/now" title="en/JavaScript/Reference/Global Objects/Date/now">Date.now()</a></code>, car cette valeur sera la même pour toutes les animations lancées dans cette fenêtre pendant cet intervalle d'actualisation, leur permettant de rester synchronisées les unes avec les autres.</p> + +<p>Cela permet également aux animations basées sur JavaScript de rester synchronisées avec les transitions CSS et les animations SMIL déclenchées pendant le même intervalle d'actualisation.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="eval notranslate"><em>time</em> = window.mozAnimationStartTime; +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<ul> + <li><em><code>time</code></em> est le temps en millisecondes depuis l'époque à laquelle les animations de la fenêtre actuelle doivent être considérées comme ayant démarré.</li> +</ul> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.mozAnimationStartTime")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("window.mozRequestAnimationFrame()")}}</li> + <li>{{domxref("window.onmozbeforepaint")}}</li> +</ul> diff --git a/files/fr/web/api/window/mozinnerscreenx/index.html b/files/fr/web/api/window/mozinnerscreenx/index.html new file mode 100644 index 0000000000..932e10789f --- /dev/null +++ b/files/fr/web/api/window/mozinnerscreenx/index.html @@ -0,0 +1,47 @@ +--- +title: Window.mozInnerScreenX +slug: Web/API/Window/mozInnerScreenX +tags: + - API + - HTML DOM + - NeedsSpecTable + - Propriété + - Reference + - Window +translation_of: Web/API/Window/mozInnerScreenX +--- +<div>{{APIRef}}{{gecko_minversion_header("1.9.2")}}</div> + +<h2 id="Résumé">Résumé</h2> + +<p>Obtient la coordonnée X du coin supérieur gauche de la fenêtre de la fenêtre, en coordonnées d'écran.</p> + +<div class="note"><strong>Note:</strong> Cette coordonnée est indiquée en pixels CSS et non en pixels matériels. <span class="tlid-translation translation" lang="fr"><span title="">Cela signifie qu'il peut être affecté par le niveau de zoom</span></span>; <span class="tlid-translation translation" lang="fr"><span title="">pour calculer le nombre réel de pixels d'écran physiques, vous devez utiliser la propriété</span></span><a href="/en-US/docs/XPCOM_Interface_Reference/nsIDOMWindowUtils"> <code>nsIDOMWindowUtils.screenPixelsPerCSSPixel</code></a>.</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><var>screenX</var> = window.mozInnerScreenX;</pre> + +<h3 id="Valeur">Valeur</h3> + +<ul> + <li><var>screenX</var> stocke la valeur de la propriété <code>window.mozInnerScreenX</code>.</li> + <li>La propriété <code>window.mozInnerScreenX</code> est une valeur en lecture seule à virgule flottante; il n'a pas de valeur par défaut.</li> +</ul> + +<h2 id="Spécification">Spécification</h2> + +<p>Ne fait partie d'aucune spécification ou recommandation technique du W3C.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.mozInnerScreenX")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("window.mozInnerScreenY")}}</li> + <li><a href="/en-US/docs/XPCOM_Interface_Reference/nsIDOMWindowUtils"><code>nsIDOMWindowUtils.screenPixelsPerCSSPixel</code></a></li> +</ul> diff --git a/files/fr/web/api/window/mozinnerscreeny/index.html b/files/fr/web/api/window/mozinnerscreeny/index.html new file mode 100644 index 0000000000..8799ff3f43 --- /dev/null +++ b/files/fr/web/api/window/mozinnerscreeny/index.html @@ -0,0 +1,47 @@ +--- +title: Window.mozInnerScreenY +slug: Web/API/Window/mozInnerScreenY +tags: + - API + - HTML DOM + - NeedsExample + - Propriété + - Reference + - Window +translation_of: Web/API/Window/mozInnerScreenY +--- +<div>{{APIRef}}{{gecko_minversion_header("1.9.2")}}</div> + +<h2 id="Résumé">Résumé</h2> + +<p>Obtient la coordonnée Y du coin supérieur gauche de la fenêtre de la fenêtre, en coordonnées d'écran.</p> + +<div class="note"><strong>Note:</strong> Cette coordonnée est indiquée en pixels CSS et non en pixels matériels. Cela signifie qu'il peut être affecté par le niveau de zoom; pour calculer le nombre réel de pixels d'écran physiques, vous devez utiliser la propriété<a href="/en-US/docs/XPCOM_Interface_Reference/nsIDOMWindowUtils"> <code>nsIDOMWindowUtils.screenPixelsPerCSSPixel</code></a>.</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><var>screenY</var> = window.mozInnerScreenY;</pre> + +<h3 id="Valeur">Valeur</h3> + +<ul> + <li><var>screenY</var> stocke la valeur de la propriété <code>window.mozInnerScreenY</code>.</li> + <li>La propriété <code>window.mozInnerScreenY</code> <span class="tlid-translation translation" lang="fr"><span title="">est une valeur en lecture seule à virgule flottante;</span> <span title="">il n'a pas de valeur par défaut.</span></span></li> +</ul> + +<h2 id="Spécification">Spécification</h2> + +<p>Ne fait partie d'aucune spécification ou recommandation technique du W3C.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.mozInnerScreenY")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("window.mozInnerScreenX")}}</li> + <li><a href="/en-US/docs/XPCOM_Interface_Reference/nsIDOMWindowUtils"><code>nsIDOMWindowUtils.screenPixelsPerCSSPixel</code></a></li> +</ul> diff --git a/files/fr/web/api/window/mozpaintcount/index.html b/files/fr/web/api/window/mozpaintcount/index.html new file mode 100644 index 0000000000..7293c9c43a --- /dev/null +++ b/files/fr/web/api/window/mozpaintcount/index.html @@ -0,0 +1,37 @@ +--- +title: Window.mozPaintCount +slug: Web/API/Window/mozPaintCount +tags: + - API + - 'API:Mozilla Extensions' + - Déprécié + - HTML DOM + - NeedsExample + - Non-standard + - Propriété + - Reference + - Window +translation_of: Web/API/Window/mozPaintCount +--- +<p>{{APIRef("Mozilla Extensions")}}{{Non-standard_Header}}{{Obsolete_Header("Gecko72")}}{{Gecko_MinVersion_Header("2.0")}}</p> + +<p>Renvoie le nombre de fois où le document actuel a été peint à l'écran dans cette fenêtre.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><code>var <em>paintCount</em> = window.mozPaintCount;</code></pre> + +<ul> + <li><code><em>paintCount</em></code> stocke la valeur de la propriété <code>window.mozPaintCount</code>.</li> + <li>La valeur <code>window.mozPaintCount</code> est <code>longue</code>, et commence à zéro <span class="tlid-translation translation" lang="fr"><span title="">lorsque le document est créé pour la première fois, en incrémentant de un à chaque fois que le document est peint.</span></span></li> +</ul> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<p>Ne fait partie d'aucune spécification ou recommandation du <abbr title="World Wide Web Consortium">W3C</abbr>.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.mozPaintCount")}}</p> diff --git a/files/fr/web/api/window/name/index.html b/files/fr/web/api/window/name/index.html new file mode 100644 index 0000000000..ef7efa9448 --- /dev/null +++ b/files/fr/web/api/window/name/index.html @@ -0,0 +1,54 @@ +--- +title: Window.name +slug: Web/API/Window/name +tags: + - API + - HTML DOM + - Propriété + - Reference +translation_of: Web/API/Window/name +--- +<div>{{APIRef}}</div> + +<h2 id="En_bref">En bref</h2> + +<p>Récupère ou définit le nom de la fenêtre.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="brush: js"><var>string</var> = window.name; +window.name = <var>string</var>; +</pre> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush:js">window.name = "lab_view"; +</pre> + +<h2 id="Notes">Notes</h2> + +<p>Les noms de fenêtres sont principalement utilisés pour définir les cibles de liens hypertextes et de formulaires. Les fenêtres n'ont pas besoin d'être nommées.</p> + +<p>Les noms de fenêtres ont en outre été utilisés par quelques <em>frameworks </em>pour le support des échanges de messages inter-domaines (par exemple <a href="http://www.thomasfrank.se/sessionvars.html">SessionVars</a> et <a href="http://www.sitepen.com/blog/2008/07/22/windowname-transport/">dojox.io.windowName</a> de Dojo) comme une alternative plus sécurisée à JSONP. Toutefois, les applications web modernes manipulant des données sensibles devraient utiliser l'<a href="/fr/docs/Web/API/Window/postMessage">API postMessage</a> pour les échanges de messages inter-domaines plutôt que s'appuyer sur <code>window.name</code>.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'browsers.html#dom-name', 'Window.name')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#dom-name', 'Window.name')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td> </td> + </tr> + </tbody> +</table> diff --git a/files/fr/web/api/window/navigator/index.html b/files/fr/web/api/window/navigator/index.html new file mode 100644 index 0000000000..52d536f092 --- /dev/null +++ b/files/fr/web/api/window/navigator/index.html @@ -0,0 +1,125 @@ +--- +title: window.navigator +slug: Web/API/Window/navigator +tags: + - DOM + - DOM_0 + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/navigator +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Renvoie une référence à l'objet + <i> + navigator</i> + , qui peut être interrogé pour obtenir des informations concernant l'application exécutant le script.</p> +<h3 id="Exemple" name="Exemple">Exemple</h3> +<pre class="eval">alert("Vous utilisez " + navigator.appName); +</pre> +<h3 id="Notes" name="Notes">Notes</h3> +<p>L'objet navigator est utilisé pour connaître le navigateur en cours d'utilisation. Il fournit des propriétés permettant d'obtenir des informations sur le navigateur lui-même. Toutes les propriétés et méthodes disponibles depuis window.navigator peuvent également être référencées simplement avec navigator.</p> +<h3 id="Propri.C3.A9t.C3.A9s" name="Propri.C3.A9t.C3.A9s">Propriétés</h3> +<dl> + <dt> + <a href="fr/DOM/window.navigator.appcodeName">navigator.appCodeName</a></dt> + <dd> + Renvoie le nom de code interne du navigateur courant.</dd> + <dt> + <a href="fr/DOM/window.navigator.appName">navigator.appName</a></dt> + <dd> + Renvoie le nom officiel du navigateur.</dd> + <dt> + <a href="fr/DOM/window.navigator.appVersion">navigator.appVersion</a></dt> + <dd> + Renvoie la version du navigateur sous la forme d'une chaîne.</dd> + <dt> + <a href="fr/DOM/window.navigator.buildID">navigator.buildID</a></dt> + <dd> + Renvoie l'identifiant de compilation du navigateur (par exemple « 2006090803 »)</dd> + <dt> + <a href="fr/DOM/window.navigator.cookieEnabled">navigator.cookieEnabled</a></dt> + <dd> + Renvoie un booléen indiquant si les cookies sont activés ou non dans le navigateur.</dd> + <dt> + <a href="fr/DOM/window.navigator.language">navigator.language</a></dt> + <dd> + Renvoie une chaîne représentant la langue utilisée par le navigateur.</dd> + <dt> + <a href="fr/DOM/window.navigator.mimeTypes">navigator.mimeTypes</a></dt> + <dd> + Renvoie une liste des types MIME gérés par le navigateur.</dd> + <dt> + <a href="fr/DOM/window.navigator.onLine">navigator.onLine</a></dt> + <dd> + Renvoie un booléen indiquant si le navigateur est en mode en ligne.</dd> + <dt> + <a href="fr/DOM/window.navigator.oscpu">navigator.oscpu</a></dt> + <dd> + Renvoie une chaîne indiquant le système d'exploitation.</dd> + <dt> + <a href="fr/DOM/window.navigator.platform">navigator.platform</a></dt> + <dd> + Renvoie une chaîne représentant la plateforme du navigateur.</dd> + <dt> + <a href="fr/DOM/window.navigator.plugins">navigator.plugins</a></dt> + <dd> + Renvoie un tableau listant les plugins installés dans le navigateur.</dd> + <dt> + <a href="fr/DOM/window.navigator.product">navigator.product</a></dt> + <dd> + Renvoie le nom de produit du navigateur (par exemple « Gecko »)</dd> + <dt> + <a href="fr/DOM/window.navigator.productSub">navigator.productSub</a></dt> + <dd> + Renvoie le numéro de compilation du produit (par exemple « 20060909 »)</dd> + <dt> + <a href="fr/DOM/window.navigator.securityPolicy">navigator.securityPolicy</a></dt> + <dd> + Renvoie une chaîne vide. Dans Netscape 4.7x, renvoyait « US & CA domestic policy » ou « Export policy ».</dd> + <dt> + <a href="fr/DOM/window.navigator.userAgent">navigator.userAgent</a></dt> + <dd> + Renvoie la chaîne d'identification d'agent utilisateur pour le navigateur courant.</dd> + <dt> + <a href="fr/DOM/window.navigator.vendor">navigator.vendor</a></dt> + <dd> + Renvoie le nom du vendeur du navigateur (par exemple « Netscape6 »)</dd> + <dt> + <a href="fr/DOM/window.navigator.vendorSub">navigator.vendorSub</a></dt> + <dd> + Renvoie le numéro de version du vendeur (par exemple « 6.1 »)</dd> +</dl> +<h3 id="M.C3.A9thodes" name="M.C3.A9thodes">Méthodes</h3> +<dl> + <dt> + <a href="fr/DOM/window.navigator.javaEnabled">navigator.javaEnabled</a></dt> + <dd> + Indique si le navigateur hôte dispose de Java activé ou non.</dd> + <dt> + <a href="fr/DOM/window.navigator.isLocallyAvailable">navigator.isLocallyAvailable</a></dt> + <dd> + Permet de vérifier si le document à une URI donnée est disponible sans utiliser le réseau.</dd> + <dt> + <a href="fr/DOM/window.navigator.preference">navigator.preference</a></dt> + <dd> + Définit une préférence utilisateur. Cette méthode est <a class="external" href="http://www.faqts.com/knowledge_base/view.phtml/aid/1608/fid/125/lang/en">uniquement disponible pour du code privilégié</a>, et il est préférable d'utiliser l'<a href="fr/API_des_pr%c3%a9f%c3%a9rences">API des préférences</a> XPCOM à la place.</dd> + <dt> + <a href="fr/DOM/window.navigator.registerContentHandler">navigator.registerContentHandler</a></dt> + <dd> + Permet aux sites Web de s'enregistrer comme gestionnaires possibles pour un type MIME donné.</dd> + <dt> + <a href="fr/DOM/window.navigator.registerProtocolHandler">navigator.registerProtocolHandler</a> {{ Fx_minversion_inline(3) }} </dt> + <dd> + Permet aux sites Web de s'enregistrer comme gestionnaires possibles pour un protocole donné.</dd> + <dt> + <a href="fr/DOM/window.navigator.taintEnabled">navigator.taintEnabled</a> {{ Obsolete_inline() }} </dt> + <dd> + Renvoie <code>false</code>. Les fonctions JavaScript taint/untaint ont été retirées de JavaScript dans sa version 1.2<a class="external" href="http://devedge-temp.mozilla.org/library/manuals/2000/javascript/1.3/reference/nav.html#1194117"> </a></dd> +</dl> +<h3 id="Voir_.C3.A9galement" name="Voir_.C3.A9galement"><a class="external" href="http://devedge-temp.mozilla.org/library/manuals/2000/javascript/1.3/reference/nav.html#1194117">Voir également </a></h3> +<p><a href="fr/R%c3%a9f%c3%a9rence_objet_crois%c3%a9e_des_clients_DOM/navigator">Référence objet croisée des clients DOM:navigator</a></p> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>{{ DOM0() }}</p> +<div class="noinclude"> + </div> +<p>{{ languages( { "en": "en/DOM/window.navigator", "ja": "ja/DOM/window.navigator", "pl": "pl/DOM/window.navigator" } ) }}</p> diff --git a/files/fr/web/api/window/offline_event/index.html b/files/fr/web/api/window/offline_event/index.html new file mode 100644 index 0000000000..a038b1ea4a --- /dev/null +++ b/files/fr/web/api/window/offline_event/index.html @@ -0,0 +1,73 @@ +--- +title: 'Window: Evenement offline' +slug: Web/API/Window/offline_event +tags: + - API + - Event + - Offline + - Reference + - Window +translation_of: Web/API/Window/offline_event +--- +<p>{{APIRef}}</p> + +<p>L'événement <strong><code>offline</code></strong> de l'interface {{domxref("Window")}} se déclenche lorsque le navigateur perd la connexion au réseau et la valeur de {{domxref("Navigator.onLine")}} bascule à <code>false</code>.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("Event")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td>{{domxref("GlobalEventHandlers.onoffline", "onoffline")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js notranslate">//version addEventListener +window.addEventListener('offline', (event) => { + console.log("La Connexion au réseau est perdu."); +}); + +// onoffline version +window.onoffline = (event) => { + console.log("La Connexion au réseau a été perdue."); +}; +</pre> + +<h2 class="brush: js" id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "indices.html#event-offline", "offline event")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_Navigateurs">Compatibilité des Navigateurs</h2> + +<p>{{Compat("api.Window.offline_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Window/online_event"><code>online</code></a></li> +</ul> diff --git a/files/fr/web/api/window/ondevicelight/index.html b/files/fr/web/api/window/ondevicelight/index.html new file mode 100644 index 0000000000..4a4357ec9a --- /dev/null +++ b/files/fr/web/api/window/ondevicelight/index.html @@ -0,0 +1,34 @@ +--- +title: Window.ondevicelight +slug: Web/API/Window/ondevicelight +tags: + - API + - Ambient Light Events + - Experimental + - Propriété + - Reference +translation_of: Web/API/Window/ondevicelight +--- +<div>{{obsolete_header}}</div> + +<p>Spécifie un écouteur d'événements pour recevoir des événements {{event ("devicelight")}}. Ces événements se produisent lorsque le capteur de niveau de lumière de l'appareil détecte une modification de l'intensité du niveau de lumière ambiante.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">window.ondevicelight = <var>funcRef</var></pre> + +<p><code><em>funcRef</em></code> est une fonction à appeler lorsque l'événement {{event("devicelight")}} se produit. Ces événements sont de type {{domxref("DeviceLightEvent")}}.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.ondevicelight")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{event("devicelight")}}</li> + <li>{{domxref("DeviceLightEvent")}}</li> + <li><a href="/en-US/docs/Web/API/DeviceLightEvent/Using_light_events">Using Light Events</a></li> +</ul> diff --git a/files/fr/web/api/window/online_event/index.html b/files/fr/web/api/window/online_event/index.html new file mode 100644 index 0000000000..0dd968c064 --- /dev/null +++ b/files/fr/web/api/window/online_event/index.html @@ -0,0 +1,79 @@ +--- +title: 'Window: online event' +slug: Web/API/Window/online_event +tags: + - API + - Evènement + - Online + - Reference + - Window +translation_of: Web/API/Window/online_event +--- +<div>{{APIRef}}</div> + +<p>L'événement <strong><code>online</code></strong> de l'interface {{domxref("Window")}} est déclenché lorsque le navigateur a obtenu l'accès au réseau et que la valeur de {{domxref("Navigator.onLine")}} passe à <code>true</code>.</p> + +<div class="note"><strong>Note:</strong> Cet événement ne doit pas être utilisé pour déterminer la disponibilité d'un site Web particulier. Des problèmes de réseau ou des pare-feu peuvent encore empêcher l'accès au site Web.</div> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>No</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>No</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("Event")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td>{{domxref("GlobalEventHandlers.ononline", "ononline")}}</td> + </tr> + </tbody> +</table> + +<dl> + <dt style="float: left; text-align: right; width: 120px;"></dt> +</dl> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js notranslate">// addEventListener version +window.addEventListener('online', (event) => { + console.log("Vous êtes maintenant connecté au réseau."); +}); + +// ononline version +window.ononline = (event) => { + console.log("Vous êtes maintenant connecté au réseau."); +}; +</pre> + +<h2 class="brush: js" id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "indices.html#event-online", "online event")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Window.online_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Window/offline_event"><code>offline</code></a></li> +</ul> diff --git a/files/fr/web/api/window/onpaint/index.html b/files/fr/web/api/window/onpaint/index.html new file mode 100644 index 0000000000..351683ba0c --- /dev/null +++ b/files/fr/web/api/window/onpaint/index.html @@ -0,0 +1,37 @@ +--- +title: Window.onpaint +slug: Web/API/Window/onpaint +tags: + - API + - Event Handler + - HTML DOM + - Non-standard + - Propriété +translation_of: Web/API/Window/onpaint +--- +<div>{{ ApiRef() }} {{Non-standard_header}}</div> + +<p><code><strong>Window.onpaint</strong></code> est un gestionnaire d'événements pour l'événement <code>paint</code> sur la fenêtre.</p> + +<div class="blockIndicator warning"> +<p>Ne fonctionne pas dans les applications basées sur Gecko actuellement, voir la section Notes!</p> +</div> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">window.onpaint = <em>funcRef</em>; +</pre> + +<ul> + <li><code>funcRef</code> est une fonction de gestionnaire.</li> +</ul> + +<h2 id="Notes">Notes</h2> + +<p><code>onpaint</code> ne fonctionne pas actuellement, et il est douteux que cet événement fonctionne du tout, voir {{ Bug(239074) }}.</p> + +<p>L'événement <code>paint</code> est déclenché lorsque la fenêtre est rendue. Cet événement se produit après l'événement {{Event ("load")}} pour une fenêtre, et se reproduit chaque fois que la fenêtre doit être restituée, par exemple lorsqu'une autre fenêtre l'obscurcit et est ensuite effacée.</p> + +<h2 id="Spécification">Spécification</h2> + +<p>Cela ne fait partie d'aucune spécification.</p> diff --git a/files/fr/web/api/window/onresize/index.html b/files/fr/web/api/window/onresize/index.html new file mode 100644 index 0000000000..d2c0d6304f --- /dev/null +++ b/files/fr/web/api/window/onresize/index.html @@ -0,0 +1,78 @@ +--- +title: window.onresize +slug: Web/API/Window/onresize +tags: + - API + - DOM + - Gestionnaires d'évènements + - Propriété + - évènements +translation_of: Web/API/GlobalEventHandlers/onresize +--- +<p>{{ ApiRef() }}</p> + +<p>La propriété <code><strong>GlobalEventHandlers.onresize</strong></code> contient un {{domxref("EventHandler")}} (<em>gestionnaire d'évènements)</em> qui survient quand un évènement {{event("resize")}} est reçu.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="eval">window.onresize = <em>funcRef</em>; +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<ul> + <li><code>funcRef</code> est une référence à une fonction.</li> +</ul> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre>window.onresize = doFunc; +</pre> + +<pre class="line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>html</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>head</span><span class="punctuation token">></span></span> + +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>title</span><span class="punctuation token">></span></span>onresize test<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>title</span><span class="punctuation token">></span></span> + +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>head</span><span class="punctuation token">></span></span> + +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>body</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>Resize the browser window to fire the resize event.<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span> + +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>Window height: <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>span</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>height<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>span</span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span><span class="punctuation token">></span></span>Window width: <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>span</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>width<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>span</span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span> + +<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="language-javascript script token"> + <span class="keyword token">var</span> heightOutput <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">'#height'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + <span class="keyword token">var</span> widthOutput <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">querySelector</span><span class="punctuation token">(</span><span class="string token">'#width'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + + <span class="keyword token">function</span> <span class="function token">resize</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + heightOutput<span class="punctuation token">.</span>textContent <span class="operator token">=</span> window<span class="punctuation token">.</span>innerHeight<span class="punctuation token">;</span> + widthOutput<span class="punctuation token">.</span>textContent <span class="operator token">=</span> window<span class="punctuation token">.</span>innerWidth<span class="punctuation token">;</span> + <span class="punctuation token">}</span> + + window<span class="punctuation token">.</span>onresize <span class="operator token">=</span> resize<span class="punctuation token">;</span> +</span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>body</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>html</span><span class="punctuation token">></span></span></code></pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>L’événement <code>resize</code> est déclenché après le redimensionnement de la fenêtre.</p> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="spectable standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG','webappapis.html#handler-onresize','onresize')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td> </td> + </tr> + </tbody> +</table> diff --git a/files/fr/web/api/window/open/index.html b/files/fr/web/api/window/open/index.html new file mode 100644 index 0000000000..d4fced2fa8 --- /dev/null +++ b/files/fr/web/api/window/open/index.html @@ -0,0 +1,770 @@ +--- +title: window.open +slug: Web/API/Window/open +tags: + - DOM + - DOM_0 +translation_of: Web/API/Window/open +--- +<p>{{ ApiRef() }}</p> + +<h3 id="D.C3.A9finition" name="D.C3.A9finition">Définition</h3> + +<p>Crée une nouvelle fenêtre de navigation secondaire et y charge la ressource référencée.</p> + +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> + +<pre class="syntaxbox language-html"><code class="language-html">var windowObjectReference = window.open(strUrl, strWindowName[, strWindowFeatures]);</code></pre> + +<h3 id="Valeur_renvoy.C3.A9e_et_param.C3.A8tres" name="Valeur_renvoy.C3.A9e_et_param.C3.A8tres">Valeur renvoyée et paramètres</h3> + +<dl> + <dt><code>WindowObjectReference</code></dt> + <dd>Il s'agit de la référence pointant vers la fenêtre de navigation nouvellement créée. Cette référence est la valeur renvoyée par la méthode <code>open()</code> ; elle sera à <code>null</code> si pour une raison ou une autre l'appel n'a pas réussi à ouvrir une fenêtre. Une variable globale est le meilleur endroit pour stocker une telle référence. Il est alors possible, par exemple, de l'utiliser pour obtenir certaines propriétés de la nouvelle fenêtre, ou accéder à certaines de ses méthodes, à condition que la relation entre votre fenêtre principale et votre fenêtre secondaire se conforme avec les paramètres de sécurité de même origine (<em><a class="external" href="http://www.mozilla.org/projects/security/components/same-origin.html">Same origin policy</a> security requirements</em> ).</dd> +</dl> + +<dl> + <dt><code>strUrl</code></dt> + <dd>Il s'agit de l'URL à charger dans la fenêtre nouvellement créée. <var>strUrl</var> peut être un document HTML, un fichier image, ou tout autre type de fichier géré par le navigateur.</dd> +</dl> + +<dl> + <dt><code>strWindowName</code></dt> + <dd>Il s'agit de la chaîne d'identification de la nouvelle fenêtre. Celle-ci peut être utilisée pour être la cible de liens et de formulaires lorsque l'attribut <code>target</code> d'un élément <code style="font-size: 1em;"><a></code> ou d'un élément <code style="font-size: 1em;"><form></code> est spécifié. Cette chaîne ne peut contenir d'espaces. <var>strWindowName</var> ne spécifie pas le titre de la fenêtre, juste son nom interne.</dd> +</dl> + +<dl> + <dt><code>strWindowFeatures</code></dt> + <dd>Paramètre optionnel. Il s'agit de la chaîne listant les fonctionnalités de la nouvelle fenêtre de navigation (et de ses barres d'outils). Cette chaîne ne peut contenir d'espaces. Chaque fonctionnalité doit être séparée par une virgule au sein de la chaîne de caractères.</dd> +</dl> + +<h3 id="Description" name="Description">Description</h3> + +<p>La méthode <code>open()</code> crée une nouvelle fenêtre secondaire de navigation, de façon similaire au choix de l'option Nouvelle fenêtre du menu Fichier. Le paramètre <var>strUrl</var> spécifie l'URL à récupérer et à charger dans la nouvelle fenêtre. Si <var>strUrl</var> est une chaîne vide, une nouvelle fenêtre vide de tout contenu (l'URL <code>about:blank</code> sera chargée) est créée avec les barres d'outils par défaut de la fenêtre principale.</p> + +<p>Notez que les URL distantes ne seront pas chargées instantanément. Lorsque l'appel à <code>window.open()</code> se termine et renvoie sa valeur, la fenêtre contient toujours <code>about:blank</code>. Le chargement proprement dit de l'URL est reporté et ne commence effectivement qu'après la fin de l'exécution du bloc de script courant. La création de la fenêtre d'une part et le chargement de la ressource référencée d'autre part sont faits de manière asynchrone.</p> + +<h4 id="Exemples" name="Exemples">Exemples</h4> + +<pre class="brush:js language-js"><code class="language-js"><span class="keyword token">var</span> windowObjectReference<span class="punctuation token">;</span> +<span class="keyword token">var</span> strWindowFeatures <span class="operator token">=</span> <span class="string token">"menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes"</span><span class="punctuation token">;</span> + +<span class="keyword token">function</span> <span class="function token">openRequestedPopup<span class="punctuation token">(</span></span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + windowObjectReference <span class="operator token">=</span> window<span class="punctuation token">.</span><span class="function token">open<span class="punctuation token">(</span></span><span class="string token">"http://www.cnn.com/"</span><span class="punctuation token">,</span> <span class="string token">"CNN_WindowName"</span><span class="punctuation token">,</span> strWindowFeatures<span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span></code></pre> + +<pre class="brush:js language-js"><code class="language-js"><span class="keyword token">var</span> windowObjectReference<span class="punctuation token">;</span> + +<span class="keyword token">function</span> <span class="function token">openRequestedPopup<span class="punctuation token">(</span></span><span class="punctuation token">)</span> <span class="punctuation token">{</span> + windowObjectReference <span class="operator token">=</span> window<span class="punctuation token">.</span><span class="function token">open<span class="punctuation token">(</span></span> + <span class="string token">"http://www.domainname.ext/path/ImageFile.png"</span><span class="punctuation token">,</span> + <span class="string token">"DescriptiveWindowName"</span><span class="punctuation token">,</span> + <span class="string token">"resizable,scrollbars,status"</span> + <span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span></code></pre> + + + +<p>Si une fenêtre du nom <var>strWindowName</var> existe déjà, alors, au lieu d'ouvrir une nouvelle fenêtre, <var>strUrl</var> est chargée dans cette fenêtre existante. Dans ce cas, la valeur renvoyée par la méthode est la fenêtre existante, et <var>strWindowFeatures</var> est ignorée. Fournir une chaîne vide pour <var>strUrl</var> est une manière d'obtenir une référence à une fenêtre ouverte par son nom sans en changer l'adresse. Si vous désirez ouvrir une nouvelle fenêtre à chaque appel de <code>window.open()</code>, il faut utiliser la nom réservé <var>_blank</var> pour <var>strWindowName</var>.</p> + +<div class="note"> +<p><strong>Note à propos de l'utilisation de window.open pour ré-ouvrir ou donner le focus à une fenêtre existante portant un nom connu du domaine </strong>: Cette fonctionalité n'est pas valide pour tous les navigateurs et qui plus est avec des comportement variables. Firefox (50.0.1) fonctionne comme il est décrit ici : depuis le même domaine+port la ré-exécution de window.open avec le même nom va accéder à la fenêtre précédemment ouverte. Google Chrome (55.0.2883.87 m ) pour sa part ne l'exécutera qu'à partir du même parent (nommé "opener", comme si les fenêtres étaient créées avec une dépendance et uniquement avec window.open). Il s'agit là d'une limitation considérable ce qui génère une incroyable complexité de développement parfois sans issue. Firefox récupère le handle vers toutes les fenêtres du domaine dont le nom est connu, ce qui permet d'accéder à leur données, mais il ne peut exécuter une commande HTMLElement.focus() vers l'une quelconque de ces fenêtres, ce qui interdit de réouvrir la fenêtre pourtant connue comme active. Pour sa part Chrome peut redonner le focus à une fenêtre (onglet) enfant mais l'opération est impossible entre frères et depuis l'enfant vers le parent. Quant aux autres fenêtres du même domaine (même famille ?) non ouvertes avec window.open elles sont inconnues et<code> window.open('',<name>,'')</code> ouvrira alors des doublons. La fonction <code>hw=window.open('',strWindowName<strong> </strong> ,'')</code> est pourtant la seule qui permette de récupérer un handle en connaissant un nom et théoriquement éviter la création de doublons, mais pour l'instant, 22/02/2017, les différences de comportement des navigateurs ne permettent de l'utiliser que de manière partielle dans des cas très restreints.</p> +</div> + +<p><var>strWindowFeatures</var> est une chaîne optionnelle contenant une liste, séparée par des virgules, de fonctionnalités demandées pour la nouvelle fenêtre. Après qu'une fenêtre soit ouverte, vous ne pouvez pas utiliser JavaScript pour changer ses fonctionnalités et ses barres d'outils. Si <var>strWindowName</var> ne spécifie pas une fenêtre existante et si vous ne fournissez pas le paramètre <var>strWindowFeatures</var> (ou si celui-ci est une chaîne vide), la nouvelle fenêtre secondaire comportera les barres d'outils par défaut de la fenêtre principale.</p> + +<p>Si le paramètre <var>strWindowFeatures</var> est utilisé et si aucune information de taille n'est définie, les dimensions de la nouvelle fenêtre seront les mêmes que celles de la fenêtre ouverte la plus récemment.</p> + +<p>Si le paramètre <var>strWindowFeatures</var> est utilisé et qu'aucune information de position n'est définie, les coordonnées du coin en haut à gauche de la nouvelle fenêtre seront décalées de 22 pixels vers le bas et vers la droite par rapport à celles de la fenêtre ouverte le plus récemment. Un décalage est utilisé par tous les concepteurs de navigateurs (il est de 29 pixels dans Internet Explorer 6 SP2 avec le thème par défaut) et son but est d'aider l'utilisateur à remarquer l'ouverture d'une nouvelle fenêtre. Si la fenêtre ouverte le plus récemment était maximisée, il n'y aura pas de décalage et la nouvelle fenêtre secondaire sera maximisée également.</p> + +<p><strong>Si le paramètre <var>strWindowFeatures</var> est défini, les fonctionnalités qui ne sont pas listées, explicitement demandées dans la chaîne, seront désactivées ou enlevées</strong> (à l'exception de <var>titlebar</var> et <var>close</var> qui sont par défaut à <var>yes</var>).</p> + +<div class="note"> +<p><strong>Astuce</strong> : Si vous utilisez le paramètre <var>strWindowFeatures</var>, listez uniquement les fonctionnalités dont vous avez besoin, qui doivent être activées ou affichées. Les autres (à l'exception de <var>titlebar</var> et <var>close</var>) seront désactivées ou enlevées.</p> +</div> + +<p style="border: 1px dotted green;"><img alt="Illustration des barres d'outils du chrome de Firefox" class="internal" src="/@api/deki/files/1286/=FirefoxChromeToolbarsDescription7a.png"></p> + +<h4 id="Fonctionnalit.C3.A9s_de_position_et_de_taille" name="Fonctionnalit.C3.A9s_de_position_et_de_taille">Fonctionnalités de position et de taille</h4> + +<p><a href="#Note_sur_les_corrections_d.27erreurs_de_position_et_de_dimension">Note sur les corrections d'erreurs de position et de dimension</a></p> + +<div class="bug">{{bug(176320) }}</div> + +<p><a href="#Note_sur_les_priorit.C3.A9s">Note sur les priorités</a></p> + +<dl> + <dt>left </dt> + <dd><span id="left">Spécifie la distance</span> à laquelle la nouvelle fenêtre est placée depuis le bord gauche de la zone de travail destinée aux applications du système d'exploitation de l'utilisateur jusqu'à la bordure extérieure (bordure de redimensionnement) de la fenêtre de navigation. La nouvelle fenêtre ne peut pas être positionnée initialement hors de l'écran.</dd> + <dd>Reconnu par : , , , , ,</dd> +</dl> + +<dl> + <dt>top </dt> + <dd><span id="topS">Spécifie la distance</span> à laquelle la nouvelle fenêtre est placée depuis le bord supérieur de la zone de travail destinée aux applications du système d'exploitation de l'utilisateur jusqu'à la bordure extérieure (bordure de redimensionnement) de la fenêtre de navigation. La nouvelle fenêtre ne peut pas être positionnée initialement hors de l'écran.</dd> + <dd>Reconnu par : , , , , ,</dd> +</dl> + +<dl> + <dt>height </dt> + <dd><span id="height">Spécifie la hauteur</span> de la zone de contenu, l'espace de visualisation de la nouvelle fenêtre secondaire, en pixels. La valeur de hauteur comprend celle de la barre de défilement horizontale si celle-ci est présente. La valeur minimale requise est 100.</dd> + <dd><a href="#Note_sur_la_diff.C3.A9rence_entre_outerHeight_et_height">Note sur la différence entre outerHeight et height (ou innerHeight)</a></dd> + <dd>Reconnu par : , , , , ,</dd> +</dl> + +<dl> + <dt>width </dt> + <dd><span id="width">Spécifie la largeur</span> de la zone de contenu, l'espace de visualisation de la nouvelle fenêtre secondaire, en pixels. La valeur de largeur comprend celle de la barre de défilement verticale si celle-ci est présente. Elle ne prend pas en compte un éventuel panneau latéral si celui-ci est déplié. La valeur minimale requise est 100.</dd> + <dd>Reconnu par : , , , , ,</dd> +</dl> + +<dl> + <dt>screenX </dt> + <dd>Déprécié. Ne plus utiliser. Similaire à <a href="#left">left</a>, mais uniquement reconnu par les navigateurs Netscape et basés sur Mozilla.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>screenY </dt> + <dd>Déprécié. Ne plus utiliser. Similaire à <a href="#topS">top</a>, mais uniquement reconnu par les navigateurs Netscape et basés sur Mozilla.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>outerHeight </dt> + <dd>Spécifie la hauteur de toute la fenêtre de navigation en pixels. Cette valeur outerHeight comprend toute barre d'outils présente, la barre de défilement horizontale de la fenêtre (si présente) et les bordures inférieures et supérieures. La valeur minimale requise est 100.</dd> + <dd><strong>Note</strong> : étant donné que la barre de titre est toujours visible, demander une valeur outerHeight=100 rendra la valeur innerHeight de la fenêtre de navigation plus petite que les 100 pixels minimaux habituels.</dd> + <dd><a href="#Note_sur_la_diff.C3.A9rence_entre_outerHeight_et_height">Note sur les différences entre outerHeight et height (ou innerHeight)</a></dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>outerWidth </dt> + <dd>Spécifie la largeur de toute la fenêtre de navigation en pixels. Cette valeur outerWidth comprend la barre de défilement verticale (si présente) et les bords gauche et droits de la fenêtre.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>innerHeight </dt> + <dd>Similaire à <a href="#height">height</a>, mais uniquement reconnu par les navigateurs Netscape et basés sur Mozilla. Spécifie la hauteur de la zone de contenu, l'espace de visualisation de la nouvelle fenêtre secondaire, en pixels. La valeur <code>innerHeight</code> comprend la hauteur de la barre de défilement horizontale si celle-ci est présente. La valeur minimale requise est 100.</dd> + <dd><a href="#Note_sur_la_diff.C3.A9rence_entre_outerHeight_et_height">Note sur les différences entre outerHeight et height (ou innerHeight)</a></dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>innerWidth </dt> + <dd>Similaire à <a href="#width">width</a> , mais uniquement reconnu par les navigateurs Netscape et basés sur Mozilla. Spécifie la largeur de la zone de contenu, l'espace de visualisation de la nouvelle fenêtre secondaire, en pixels. La valeur <code>innerWidth</code> comprend la largeur de la barre de défilement verticale si celle-ci est présente. Elle ne prend pas en compte un éventuel panneau latéral si celui-ci est déplié. La valeur minimale requise est 100.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<h4 id="Fonctionnalit.C3.A9s_de_barres_d.27outils_et_de_chrome" name="Fonctionnalit.C3.A9s_de_barres_d.27outils_et_de_chrome">Fonctionnalités de barres d'outils et de chrome</h4> + +<dl> + <dt>menubar </dt> + <dd>Si cette fonctionnalité est définie à <var>yes</var>, la nouvelle fenêtre secondaire disposera d'une barre de menus.</dd> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger les nouvelles fenêtres à toujours avoir une barre de menus en positionnant <code>dom.disable_window_open_feature.menubar</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd>Reconnu par : , , , ,</dd> +</dl> + +<dl> + <dt>toolbar </dt> + <dd>Si cette fonctionnalité est définie à <var>yes</var>, la nouvelle fenêtre secondaire disposera d'une barre de navigation (boutons Précédente, Suivante, Actualiser et Arrêter). En plus de la barre de navigation, les navigateurs basés sur Mozilla afficheront également la barre d'onglets si elle est toujours visible et présente dans la fenêtre parente.</dd> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger les nouvelles fenêtres à toujours afficher la barre de navigation en positionnant <code>dom.disable_window_open_feature.toolbar</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd>Reconnu par : , , , ,</dd> +</dl> + +<dl> + <dt>location </dt> + <dd>Si cette fonctionnalité est définie à <var>yes</var>, la nouvelle fenêtre secondaire affichera une barre d'adresse (ou d'emplacement).</dd> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger les nouvelles fenêtres à toujours afficher la barre d'adresse en positionnant <code>dom.disable_window_open_feature.location</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd>Notez qu'Internet Explorer 7 force la présence de la barre d'adresse : « Nous pensons que la barre d'adresse est aussi importante pour les utilisateurs <strong>à voir dans les fenêtres pop-up</strong>. Une barre d'adresse manquante crée une opportunité pour un fraudeur de contrefaire une adresse. Pour aider à contrer cela, <strong>IE7 va afficher une barre d'adresse sur toutes les fenêtres de navigation pour aider les utilisateurs à voir où ils sont</strong>. » provenant de <a class="external" href="http://blogs.msdn.com/ie/archive/2005/11/21.aspx">Better Website Identification</a>.</dd> + <dd>Il est également dans les intentions de Mozilla de forcer la présence de la Barre d'adresse dans une prochaine version de Firefox :</dd> + <dd> + <div class="bug">{{bug(337344) }}</div> + </dd> +</dl> + +<dl> + <dd>Reconnu par : , , , , ,</dd> +</dl> + +<dl> + <dt>directories </dt> + <dd>Si cette fonctionnalité est définie à <var>yes</var>, la nouvelle fenêtre secondaire affichera la barre personnelle dans les navigateurs Netscape 6.x, Netscape 7.x, Mozilla et Firefox. Dans Internet Explorer 5+, la barre de liens sera affichée. En plus de la barre personnelle, les navigateurs Mozilla afficheront la barre de navigation du site si celle-ci est visible et présente dans la fenêtre parente.</dd> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger les nouvelles fenêtres à toujours afficher leur barre personnelle en positionnant<code>dom.disable_window_open_feature.directories</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd>Reconnu par : , , , ,</dd> +</dl> + +<dl> + <dt>personalbar </dt> + <dd>Similaire à <var>directories</var>, mais ne fonctionne que dans Netscape et les navigateurs basés sur Mozilla.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>status </dt> + <dd>Si cette fonctionnalité est définie à <var>yes</var>, la nouvelle fenêtre secondaire disposera d'une barre d'état. Les utilisateurs peuvent forcer la présence de la barre d'état dans tous les navigateurs basés sur Mozilla, dans Internet Explorer 6 SP2 (<a href="#Note_sur_les_probl.C3.A8mes_de_s.C3.A9curit.C3.A9_li.C3.A9s_.C3.A0_la_pr.C3.A9sence_de_la_barre_d.27.C3.A9tat">Note sur la barre d'état avec XP SP2</a>) et dans Opera 6+. Les réglages par défaut des navigateurs récents basés sur Mozilla et Firefox 1.0 forcent la présence de la barre d'état.</dd> + <dd><a href="#Note_sur_la_barre_d.27.C3.A9tat">Note sur la barre d'état</a></dd> + <dd>Reconnu par : , , , ,</dd> +</dl> + +<h4 id="Fonctionnalit.C3.A9s_relatives_.C3.A0_la_fen.C3.AAtre" name="Fonctionnalit.C3.A9s_relatives_.C3.A0_la_fen.C3.AAtre">Fonctionnalités relatives à la fenêtre</h4> + +<dl> + <dt>resizable </dt> + <dd>Si cette fonctionnalité est définie à <var>yes</var>, la nouvelle fenêtre secondaire sera redimensionnable.</dd> + <dd><strong>Note</strong> : à partir de la version 1.4, les navigateurs basés sur Mozilla ont une zone de redimensionnement à l'extrémité droite de la barre d'état. Cela permet de s'assurer que les utilisateurs peuvent toujours redimensionner la fenêtre même si l'auteur de la page Web a demandé que cette fenêtre secondaire ne soit pas redimensionnable. Dans ce cas, les icônes de maximisation/restauration dans la barre de titre de la fenêtre seront désactivées et les bordures de la fenêtre ne permettront pas de la redimensionner, mais celle-ci pourra toujours être redimensionnée via cette zone de la barre d'état.</dd> + <dd>Il est probable qu'à partir de Firefox 3, toutes les fenêtres secondaires seront redimensionnables ({{ Bug(177838) }})</dd> +</dl> + +<div class="note"> +<p><strong>Astuce</strong> : pour des raisons d'accessibilité, il est vivement recommandé de toujours définir cette fonctionnalité à <var>yes</var>.</p> +</div> + +<dl> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger les nouvelles fenêtres à être facilement redimensionnables en positionnant <code>dom.disable_window_open_feature.resizable</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd>Reconnu par : , , , ,</dd> +</dl> + +<dl> + <dt>scrollbars </dt> + <dd>Si cette fonctionnalité est définie à <var>yes</var>, la nouvelle fenêtre secondaire affichera des barres de défilement horizontales et/ou verticales si le document ne rentre pas dans la zone d'affichage de la fenêtre.</dd> +</dl> + +<div class="note"> +<p><strong>Astuce</strong> : pour des raisons d'accessibilité, il est vivement recommandé de toujours définir cette fonctionnalité à <var>yes</var>.</p> +</div> + +<dl> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger cette option à être toujours activée en positionnant <code>dom.disable_window_open_feature.scrollbars</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd><a href="#Note_sur_les_barres_de_d.C3.A9filement">Note sur les barres de défilement</a></dd> + <dd>Reconnu par : , , , ,</dd> +</dl> + +<dl> + <dt>dependent </dt> + <dd>Si définie à <var>yes</var>, la nouvelle fenêtre est dite dépendante de sa fenêtre parente. Une fenêtre dépendante se ferme lorsque sa fenêtre parente est fermée. Une fenêtre dépendante est réduite dans la barre des tâches uniquement lorsque sa fenêtre parente est réduite. Sur les plateformes Windows, une fenêtre dépendante n'est pas affichée sur la barre des tâches. Elle reste également en avant-plan de la fenêtre parente.</dd> + <dd>Les fenêtres dépendantes n'existent pas sous Mac OS X, cette option y sera ignorée.</dd> + <dd>La suppression complète de cette fonctionnalité sur toutes les plateformes est en cours de discussion ({{ Bug(214867) }})</dd> + <dd>Dans Internet Explorer 6, le plus proche équivalent à cette fonctionnalité est la méthode <code>showModelessDialog()</code>.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>modal </dt> + <dd><strong>Note</strong> : à partir de Mozilla 1.2.1, cette fonctionnalité requiert le privilège <code>UniversalBrowserWrite</code> ({{ Bug(180048) }}). Sans ce privilège, elle est équivalente à <code>dependent</code>.</dd> + <dd>Si définie à <var>yes</var>, la nouvelle fenêtre est dite modale. L'utilisateur ne peut pas retourner à la fenêtre principale tant que la fenêtre modale n'est pas fermée. Une fenêtre modale typique est créée par la <a href="fr/DOM/window.alert">fonction alert()</a>.</dd> + <dd>Le comportement exact des fenêtres modales dépend de la plateforme et de la version de Mozilla.</dd> + <dd>L'équivalent de cette fonctionnalité dans Internet Explorer 6 est la méthode <code>showModalDialog()</code>.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>dialog </dt> + <dd>La fonctionnalité <code>dialog</code> retire toutes les icônes (restaurer, réduire, agrandir) de la barre de titre de la fenêtre, laissant uniquement le bouton de fermeture. Mozilla 1.2+ et Netscape 7.1 afficheront les autres commandes du menu système (dans Firefox 1.0 et Netscape 7.0x, le menu de commandes système n'est pas associé avec l'icône de Firefox/Netscape 7.0x à l'extrémité gauche de la barre de titre, il s'agit probablement d'un bug. Il est possible d'accéder au menu de commandes système avec un clic droit sur la barre de titre). Les fenêtres de dialogue sont des fenêtres qui n'ont pas d'icône de commande système de réduction ni d'agrandissement/restauration dans la barre de titre, ni dans les choix correspondants du menu de commandes système. On les appelle dialogues car leur utilisation normale est uniquement de notifier une information et d'être ensuite immédiatement fermées. Sur les systèmes Mac, les fenêtres de dialogue ont une bordure différente et peuvent prendre la forme de<em>sheets</em> .</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>minimizable </dt> + <dd>Ce paramètre peut uniquement s'appliquer à des fenêtres de dialogue ; l'utilisation de « minimizable » nécessite <code>dialog=yes</code>. Si <code>minimizable</code> est défini à <var>yes</var>, le nouveau dialogue aura une commande système de réduction dans la barre de titre et il sera possible de le réduire dans la barre des tâches. Toute fenêtre n'étant pas un dialogue est toujours réductible, cette option y sera donc ignorée.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>fullscreen </dt> + <dd>À ne pas utiliser. N'est pas reconnu par Mozilla, et il n'existe aucun plan prévoyant de le faire fonctionner dans Mozilla.</dd> + <dd>Ce paramètre ne fonctionne plus dans Internet Explorer 6 SP2 de la façon dont il le faisait dans Internet Explorer 5.x. La barre des tâches de Windows, ainsi que la barre de titre et la barre d'état de la fenêtre ne sont ni visibles, ni accessibles lorsque le mode plein écran est activé dans IE 5.x.</dd> + <dd><code>fullscreen</code> ennuie toujours les utilisateurs disposant d'un grand écran ou de plusieurs écrans. Obliger les autres utilisateurs à passer en plein écran avec <code>fullscreen</code> est également extrêmement impopulaire et est considéré comme une tentative impolie d'imposer les préférences d'affichage de l'auteur à l'utilisateur.</dd> + <dd><a href="#Note_sur_le_plein_.C3.A9cran_.28fullscreen.29">Note sur fullscreen</a></dd> + <dd>Reconnu par :</dd> + <dd><code>fullscreen</code> ne fonctionne plus vraiment dans Internet Explorer 6 SP2.</dd> +</dl> + +<h4 id="Fonctionnalit.C3.A9s_n.C3.A9cessitant_des_privil.C3.A8ges" name="Fonctionnalit.C3.A9s_n.C3.A9cessitant_des_privil.C3.A8ges">Fonctionnalités nécessitant des privilèges</h4> + +<p>Les fonctionnalités suivantes nécessitent le privilège <code>UniversalBrowserWrite</code>, autrement elles seront ignorées. Les scripts chrome bénéficient de ce privilège automatiquement, les autres doivent le demander via le <a href="fr/PrivilegeManager">PrivilegeManager</a>.</p> + +<dl> + <dt>chrome </dt> + <dd><strong>Note</strong> : à partir de Mozilla 1.7/Firefox 0.9, cette fonctionnalité requiert le privilège <code>UniversalBrowserWrite</code> ({{ Bug(244965) }}). Sans ce privilège, elle est ignorée.</dd> + <dd>Si définie à <var>yes</var>, la page est chargée en tant qu'unique contenu de la fenêtre, sans aucun autre élément de l'interface de navigation. Il n'y aura pas de menu contextuel défini par défaut, et aucun des raccourcis clavier standard ne fonctionnera. La page est supposée fournir sa propre interface utilisateur, et cette fonctionnalité est habituellement utilisée pour ouvrir des documents XUL (les dialogues standard comme la console JavaScript sont ouverts de cette façon).</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>titlebar </dt> + <dd>Par défaut, toutes les nouvelles fenêtres secondaires ont une barre de titre. Si défini à <var>no</var>, ce paramètre enlève la barre de titre de la nouvelle fenêtre secondaire.</dd> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger les nouvelles fenêtres à toujours avoir une barre de titre en positionnant<code>dom.disable_window_open_feature.titlebar</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>alwaysRaised </dt> + <dd>Si défini à <var>yes</var>, la nouvelle fenêtre sera toujours affichée par dessus les autres fenêtres du navigateur, qu'elle soit active ou non.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>alwaysLowered </dt> + <dd>Si défini à <var>yes</var>, la nouvelle fenêtre créé flottera par dessous sa propre fenêtre parente tant que celle-ci n'est pas réduite. Les fenêtres utilisant alwaysLowered sont souvent appelées pop-under. Celles-ci ne peuvent pas passer au dessus de leur fenêtre parente, mais celle-ci peut être réduite. Dans Netscape 6.x, les fenêtres alwaysLowered n'ont pas de commande système de réduction ni de commande système restaurer/agrandir.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<dl> + <dt>z-lock </dt> + <dd>Identique à <code>alwaysLowered</code>.</dd> +</dl> + +<dl> + <dt>close </dt> + <dd>Lorsque défini à <var>no</var>, ce paramètre supprime l'icône système de fermeture de la fenêtre, et l'élément de menu correspondant. Il fonctionnera uniquement pour les fenêtres de dialogue (avec la fonctionnalité <code>dialog</code> activée). <code>close=no</code> a précédence sur <code>minimizable=yes</code>.</dd> + <dd>Les utilisateurs de Mozilla et Firefox peuvent obliger les nouvelles fenêtres à toujours avoir un bouton de fermeture en positionnant <code>dom.disable_window_open_feature.close</code> à <var>true</var> dans <kbd>about:config</kbd> ou dans leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> + <dd>Reconnu par : , , ,</dd> +</dl> + +<p>Les fonctionnalités de position et de taille nécessitent d'être accompagnées d'un nombre. Les fonctionnalités de barres d'outils et de fenêtre peuvent être accompagnées de <var>yes</var> (oui) ou <var>no</var> (non) ; il est également possible d'utiliser <var>1</var> à la place de <var>yes</var> et <var>0</var> à la place de <var>no</var>. Les fonctionnalités de barres d'outils et de fenêtre acceptent aussi une forme raccourcie : vous pouvez activer une fonctionnalité en listant simplement son nom dans la chaîne <var>strWindowFeatures</var>. Si vous fournissez le paramètre <var>strWindowFeatures</var>, les fonctionnalités <code>titlebar</code> et <code>close</code> sont toujours à <var>yes</var> par défaut, mais les autres fonctionnalités présentant un choix <var>yes</var>/<var>no</var> seront à <var>no</var> par défaut et seront donc désactivées.</p> + +<p>Exemple :</p> + +<pre><script type="text/javascript"> +var WindowObjectReference; // variable globale + +function openRequestedPopup() { + WindowObjectReference = window.open("http://www.nomdedomaine.ext/chemin/FichierImg.png", + "NomDeFenetreDescriptif", + "width=420,height=230,resizable,scrollbars=yes,status=1"); +} +</script> +</pre> + +<p>Dans cet exemple, la fenêtre sera redimensionnable, elle affichera des barres de défilement si nécessaire (si le contenu dépasse les dimensions de fenêtre demandées) et affichera la barre d'état. Elle n'affichera pas la barre de menus ni la barre d'adresse. Comme l'auteur connaissait la taille de l'image (400 pixels de large et 200 pixels de haut), il a ajouté les marges appliquées à l'élément racine dans Internet Explorer 6, c'est-à-dire 15 pixels en haut, 15 pixels en bas, 10 pixels à gauche et 10 pixels à droite.</p> + +<h3 id="Bonnes_pratiques" name="Bonnes_pratiques">Bonnes pratiques</h3> + +<pre><script type="text/javascript"> +var WindowObjectReference = null; // variable globale + +function openFFPromotionPopup() { + if (WindowObjectReference == null || WindowObjectReference.closed) { + /* si le pointeur vers l'objet window n'existe pas, ou s'il existe + mais que la fenêtre a été fermée */ + WindowObjectReference = window.open("http://www.spreadfirefox.com/", + "PromoteFirefoxWindowName", "resizable=yes,scrollbars=yes,status=yes"); + /* alors, création du pointeur. La nouvelle fenêtre sera créée par dessus + toute autre fenêtre existante. */ + } + else { + WindowObjectReference.focus(); + /* sinon, la référence à la fenêtre existe et la fenêtre n'a pas été + fermée: la fenêtre est peut-être minimisée ou derrière la fenêtre + principale. Par conséquent, on peut l'amener par dessus les autres à + l'aide de la méthode focus(). Il n'est pas nécessaire de recréer la fenêtre + ou de recharger la ressource référencée. */ + }; +} +</script> + +(...) + +<p><a href="http://www.spreadfirefox.com/" target="PromoteFirefoxWindowName" onclick="openFFPromotionPopup(); return false;" title="Ce lien créera une nouvelle fenêtre ou en réutilisera une déjà ouverte">Promouvoir +l'adoption de Firefox</a></p> +</pre> + +<p>Le code ci-dessus résout un certain nombre de problèmes d'utilisabilité (<em>usability</em> ) relatif aux liens ouvrant des fenêtres secondaires. Le but du <code>return false</code> dans le code est d'annuler l'action par défaut du lien : si le gestionnaire d'évènements onclick est exécuté, il n'est pas nécessaire d'exécuter l'action par défaut du lien. Mais si JavaScript est désactivé ou non existant dans le navigateur de l'utilisateur, c'est l'évènement onclick qui est ignoré et le navigateur charge la ressource référencée dans le cadre ou la fenêtre portant le nom « PromoteFirefoxWindowName ». Si aucun cadre ni fenêtre ne porte ce nom, le navigateur créera une nouvelle fenêtre et l'appellera « PromoteFirefoxWindowName ».</p> + +<p>Plus d'informations sur l'utilisation de l'attribut target :</p> + +<p><a class="external" href="http://www.la-grange.net/w3c/html4.01/present/frames.html#h-16.3.2">HTML 4.01, section 16.3.2 La sémantique de cible</a></p> + +<p><a class="external" href="http://www.htmlhelp.com/fr/faq/html/links.html#new-window">Comment créer un lien qui ouvre une nouvelle fenêtre?</a></p> + +<p>Vous pouvez également paramétriser la fonction pour la rendre polyvalente, fonctionnelle dans plus de situations, et donc réutilisable dans d'autres scripts et pages Web :</p> + +<pre><script type="text/javascript"> +var WindowObjectReference = null; // variable globale + +function openRequestedPopup(strUrl, strWindowName) { + if(WindowObjectReference == null || WindowObjectReference.closed) { + WindowObjectReference = window.open(strUrl, strWindowName, + "resizable=yes,scrollbars=yes,status=yes"); + } + else { + WindowObjectReference.focus(); + }; +} +</script> +(...) + +<p><a href="http://www.spreadfirefox.com/" target="PromoteFirefoxWindow" onclick="openRequestedPopup(this.href, this.target); return false;" title="Ce lien créera une nouvelle fenêtre ou en réutilisera une déjà ouverte">Promouvoir l'adoption de Firefox</a></p> +</pre> + +<p>Vous pouvez également ne permettre à cette fonction que d'ouvrir une seule fenêtre secondaire et de la réutiliser pour d'autres liens de cette manière :</p> + +<pre><script type="text/javascript"> +var WindowObjectReference = null; // variable globale +var PreviousUrl; /* variable globale qui stockera l'URL actuellement + chargée dans la fenêtre secondaire */ + +function openRequestedSinglePopup(strUrl) +{ + if(WindowObjectReference == null || WindowObjectReference.closed) + { + WindowObjectReference = window.open(strUrl, "SingleSecondaryWindowName", + "resizable=yes,scrollbars=yes,status=yes"); + } + else if(previousUrl != strUrl) + { + WindowObjectReference = window.open(strUrl, "SingleSecondaryWindowName", + "resizable=yes,scrollbars=yes,status=yes"); + /* si la ressource à charger est différente, on la charge dans la fenêtre + secondaire déjà ouverte, et on ramène ensuite celle-ci par dessus + sa fenêtre parente. */ + WindowObjectReference.focus(); + } + else + { + WindowObjectReference.focus(); + }; + PreviousUrl = strUrl; + /* explication : on stocke l'URL courante afin de pouvoir la comparer + dans le cas d'un autre appel à cette fonction. */ +} +</script> + +(...) + +<p><a href="http://www.spreadfirefox.com/" target="SingleSecondaryWindowName" +onclick="openRequestedSinglePopup(this.href); return false;" +title="Ce lien créera une nouvelle fenêtre ou en réutilisera une déjà ouverte">Promouvoir +l'adoption de Firefox</a></p> +<p><a href="http://www.mozilla.org/support/firefox/faq" +target="SingleSecondaryWindowName" +onclick="openRequestedSinglePopup(this.href); return false;" +title="Ce lien créera une nouvelle fenêtre ou en réutilisera une déjà ouverte">FAQ +de Firefox</a></p> +</pre> + +<h3 id="FAQ" name="FAQ">FAQ</h3> + +<dl> + <dt>Comment empêcher l'apparition du message de confirmation demandant à l'utilisateur s'il veut fermer la fenêtre ?</dt> + <dd>Vous ne pouvez pas. <strong>La règle est que les nouvelles fenêtres qui ne sont pas ouvertes par JavaScript ne peuvent pas être fermées par JavaScript.</strong> La console JavaScript dans les navigateurs basés sur Mozilla affichera le message d'avertissement suivant : <code>"Scripts may not close windows that were not opened by script."</code> Si c'était possible, l'historique des URL visitées durant la session de navigation serait perdu au détriment de l'utilisateur.</dd> + <dd><a href="fr/DOM/window.close">Plus de détails sur la méthode window.close()</a></dd> +</dl> + +<dl> + <dt>Comment ramener la fenêtre si elle est réduite ou masquée par une autre fenêtre ?</dt> + <dd>Vérifiez d'abord l'existence de la référence à l'objet window, et si celle-ci existe et n'a pas été fermée, utilisez la méthode <a href="fr/DOM/window.focus">focus()</a>. Il n'y a pas d'autre manière fiable. Un <a href="#Bonnes_pratiques">exemple montrant comment utiliser la méthode focus()</a> est présenté ci-dessus.</dd> +</dl> + +<dl> + <dt>Comment forcer une fenêtre à être agrandie/maximisée ?</dt> + <dd>Ce n'est pas possible. Tous les fabricants de navigateurs essaient de rendre l'ouverture d'une nouvelle fenêtre visible et remarquée par les utilisateurs, afin d'éviter de les désorienter.</dd> +</dl> + +<dl> + <dt>Comment désactiver le redimensionnement des fenêtres ou supprimer les barres d'outils ?</dt> + <dd>Il n'est pas possible de l'imposer. Les utilisateurs de navigateurs basés sur Mozilla ont un contrôle absolu sur les fonctionnalités des fenêtres comme le fait de pouvoir les redimensionner, de les faire défiler et la présence de barres d'outils via les préférences utilisateur dans <code>about:config</code>. Comme vos utilisateurs sont ceux qui sont supposés utiliser de telles fenêtres (et non vous en tant qu'auteur), le mieux est d'éviter d'interférer avec leurs habitudes et préférences. Il est recommandé de toujours positionner la redimensionnabilité et la présence de barres de défilement (si nécessaire) à <code>yes</code> pour assurer l'accessibilité au contenu et l'utilisabilité des fenêtres. Ceci est dans l'intérêt tant de l'auteur Web que de ses utilisateurs.</dd> +</dl> + +<dl> + <dt>Comment redimensionner une fenêtre en fonction de son contenu ?</dt> + <dd>Ce n'est pas faisable de manière fiable, car les utilisateurs peuvent empêcher la fenêtre d'être redimensionnée en décochant la case <code style="white-space: normal;">Édition/Préférences/Avancé/Scripts & plugins/Autoriser les scripts à/ Déplacer ou redimensionner des fenêtres existantes</code> dans Mozilla ou <code style="white-space: normal;">Outils/Options/Contenu/Activer JavaScript/Bouton Avancé/Déplacer ou redimensionner des fenêtres existantes</code> dans Firefox, ou en positionnant <code>dom.disable_window_move_resize</code> à <var>true</var> dans <kbd>about:config</kbd> ou encore en éditant leur <a class="external" href="http://www.mozilla.org/support/firefox/edit#user">fichier user.js</a>.</dd> +</dl> + +<dl> + <dd>En général, les utilisateurs désactivent le déplacement et le redimensionnement des fenêtres, étant donné qu'autoriser les scripts à le faire a été la source d'énormément d'abus dans le passé, et les rares scripts qui n'en abusent pas sont souvent incorrects dans leur manière de redimensionner la fenêtre. 99% de ces scripts désactivent le redimensionnement manuel des fenêtres et les barres de défilement alors qu'ils devraient en fait activer ces deux fonctionnalités pour permettre un mécanisme de récupération sain et circonspect dans le cas où leurs calculs s'avèreraient incorrects.</dd> +</dl> + +<dl> + <dd>La méthode <a href="fr/DOM/window.sizeToContent">sizeToContent()</a> de l'objet window est également désactivée si l'utilisateur décoche la préférence <code>Déplacer ou redimensionner des fenêtres existantes</code>. Déplacer et redimensionner une fenêtre à distance sur l'écran de l'utilisateur l'ennuiera très souvent, le désorientera, et au mieux sera incorrect. Les auteurs Web espèrent souvent avoir un contrôle absolu (et un pouvoir de décision) sur tous les aspects de positionnement et de taille des fenêtres de l'utilisateur ... ce qui n'est tout simplement pas vrai.</dd> +</dl> + +<dl> + <dt>Comment ouvrir une ressource référencée par un lien dans un nouvel onglet ? ou dans un onglet spécifique ?</dt> + <dd>Pour l'instant, ce n'est pas possible. Seul l'utilisateur peut modifier ses préférences avancées pour faire cela. <a class="external" href="http://kmeleon.sourceforge.net/">K-meleon 1.1</a>, un navigateur basé sur Mozilla, donne un contrôle et un pouvoir complet à l'utilisateur sur la manière dont les liens sont ouverts. Certaines extensions avancées donnent également à Mozilla et Firefox un grand pouvoir concernant la manière dont les ressources référencées sont chargées.</dd> +</dl> + +<dl> + <dd>Dans quelques années, la <a class="external" href="http://www.w3.org/TR/2004/WD-css3-hyperlinks-20040224/#target0">propriété target du module CSS3 hyperlien</a> pourrait être implémentée (si le module CSS3 Hyperlink tel qu'il existe à présent est approuvé). Même si cela se fait et lorsque cela se produira, attendez-vous à ce que les développeurs de navigateurs utilisant des onglets donnent un pouvoir de veto à l'utilisateur et un contrôle total de la façon dont les liens peuvent ouvrir des pages Web. La façon d'ouvrir un lien devrait toujours être entièrement sous le contrôle de l'utilisateur.</dd> +</dl> + +<dl> + <dt>Comment savoir si une fenêtre que j'ai ouverte l'est toujours ?</dt> + <dd>Vous pouvez tester l'existence de la référence à l'objet window, qui est la valeur renvoyée en cas de succès de l'appel à window.open(), et vérifier ensuite que la valeur renvoyée par <var>WindowObjectReference</var>.closed est bien <var>false</var>.</dd> +</dl> + +<dl> + <dt>Comment savoir si ma fenêtre a été bloquée par un bloqueur de popups ?</dt> + <dd>Avec les bloqueurs de popups intégrés dans Mozilla/Firefox et Internet Explorer 6 SP2, il est possible de vérifier la valeur renvoyée par <code>window.open()</code> : elle sera <var>null</var> si la fenêtre n'a pas été autorisée à s'ouvrir. Cependant, pour la plupart des autres bloqueurs de popups, il n'existe pas de manière fiable.</dd> +</dl> + +<dl> + <dt>Quelle est la relation JavaScript entre la fenêtre principale et la fenêtre secondaire ?</dt> + <dd>La valeur renvoyée par la méthode window.open() est la propriété <a href="fr/DOM/window.opener">opener</a>. La variable <var>WindowObjectReference</var> lie la fenêtre principale (opener) à la fenêtre secondaire qu'elle a ouverte, tandis que le mot-clé <code>opener</code> liera la fenêtre secondaire à sa fenêtre principale (celle qui a déclenché son ouverture).</dd> +</dl> + +<dl> + <dt>Je n'arrive pas à accéder aux propriétés de la nouvelle fenêtre secondaire. J'obtiens toujours une erreur dans la console JavaScript disant « Erreur <span class="nowiki">:</span> uncaught exception<span class="nowiki">:</span> Permission denied to get property <property_name or method_name> ». Pourquoi cela ?</dt> + <dd>Ceci est causé par la restriction de sécurité des scripts entre domaines (aussi appelée<em>Same Origin Policy</em> , « Politique de même origine »). Un script chargé dans une fenêtre (ou cadre) d'une origine donnée (nom de domaine) <strong>ne peut pas obtenir ou modifier</strong> des propriétés d'une autre fenêtre (ou cadre) ou les propriétés d'aucun de ses objets HTML si celle-ci provient d'une autre origine distincte (nom de domaine). C'est pourquoi, avant d'exécuter un script se référant à une fenêtre secondaire depuis la fenêtre principale, le navigateur vérifiera que la fenêtre secondaire possède le même nom de domaine.</dd> + <dd>Plus d'informations à propos de la restriction de sécurité des scripts entre domaines : <a class="external" href="http://www.mozilla.org/projects/security/components/same-origin.html" rel="freelink">http://www.mozilla.org/projects/secu...me-origin.html</a></dd> +</dl> + +<h3 id="Probl.C3.A8mes_d.27utilisabilit.C3.A9" name="Probl.C3.A8mes_d.27utilisabilit.C3.A9">Problèmes d'utilisabilité</h3> + +<h4 id=".C3.89vitez_de_recourir_.C3.A0_window.open.28.29" name=".C3.89vitez_de_recourir_.C3.A0_window.open.28.29">Évitez de recourir à <code>window.open()</code></h4> + +<p>De manière générale, il est préférable d'éviter d'utiliser window.open() pour plusieurs raisons :</p> + +<ul> + <li>Tous les navigateurs basés sur Mozilla offrent la navigation par onglets, et il s'agit du mode préféré pour ouvrir des ressources référencées… pas seulement dans le cas des navigateurs basés sur Mozilla, mais dans tous les autres navigateurs offrant la navigation par onglets. En d'autres mots, les utilisateurs de navigateurs utilisant des onglets préfèrent ouvrir des onglets que des fenêtres dans la plupart des situations. Ce type de navigateur gagne rapidement en popularité depuis plusieurs années et cette tendance ne semble pas près de s'arrêter. La version 7 d'Internet Explorer sortie en octobre 2006 propose également la navigation par onglets.</li> +</ul> + +<ul> + <li>Il existe à présent <a class="link-https" href="https://addons.update.mozilla.org/extensions/showlist.php?application=mozilla&category=Tabbed+Browsing&numpg=50&os=windows&version=auto-detect&submit=Update">plusieurs extensions à Mozilla</a> (comme Multizilla) et <a class="link-https" href="https://addons.update.mozilla.org/extensions/showlist.php?application=firefox&version=1.0+&os=Windows&category=Tabbed%20Browsing">à Firefox</a> (comme <a class="link-https" href="https://addons.update.mozilla.org/extensions/moreinfo.php?application=firefox&version=1.0%20&os=Windows&category=Tabbed%20Browsing&numpg=10&id=158">Tabbrowser preferences</a>), fonctionnalités et préférences avancées basées sur la navigation par onglets, sur la conversion des appels à window.open() en ouvertures d'onglets, et sur la neutralisation des appels à window.open(). En particulier, afin de neutraliser l'ouverture de nouvelles fenêtres non demandées (souvent présentés comme bloquant les fenêtre popups non sollicitées ou les ouvertures automatiques de fenêtres par des scripts). Parmi ces fonctionnalités qu'on peut retrouver dans des extensions, il y a l'ouverture d'un lien dans une nouvelle fenêtre ou non, dans la même fenêtre, dans un nouvel onglet ou non, en arrière-plan ou non. Coder sans réfléchir pour ouvrir de nouvelles fenêtres n'est plus assuré de succès, ne pourra pas se faire par la force, et dans le cas où l'auteur Web y parvient, ne fera qu'ennuyer la majorité des utilisateurs.</li> +</ul> + +<ul> + <li>Les nouvelles fenêtres peuvent avoir leur barre de menu, leurs barres de défilement, leur barre d'état, leur redimensionnabilité etc. désactivées. Ceci n'est pas possible avec de nouveaux onglets. Par conséquent, de nombreux utilisateurs préfèrent utiliser des onglets étant donné que l'interface de leur navigateur est laissée intacte et reste stable.</li> +</ul> + +<ul> + <li>L'ouverture de nouvelles fenêtres, même avec leurs fonctionnalités réduites, utilise des ressources système considérables sur l'ordinateur de l'utilisateur (processeur, mémoire RAM) et met en jeu une grande quantité de code à exécuter (gestion de la sécurité, de la mémoire, diverses options de code parfois assez complexes, la construction du cadre de la fenêtre, des barres d'outils de la fenêtre, son positionnement et sa taille, etc.). L'ouverture de nouveaux onglets demande nettement moins de ressources système et est plus rapide à exécuter que d'ouvrir de nouvelles fenêtres.</li> +</ul> + +<h4 id="Offrez_d.27ouvrir_un_lien_dans_une_nouvelle_fen.C3.AAtre.2C_en_suivant_ces_recommandations" name="Offrez_d.27ouvrir_un_lien_dans_une_nouvelle_fen.C3.AAtre.2C_en_suivant_ces_recommandations">Offrez d'ouvrir un lien dans une nouvelle fenêtre, en suivant ces recommandations</h4> + +<p>Si vous voulez permettre l'ouverture d'un lien dans une nouvelle fenêtre, suivez ces règles d'utilisabilité et d'accessibilité testées et éprouvées :</p> + +<h5 id="N.27utilisez_jamais_ce_format_de_code_pour_les_liens_.3Ca_href.3D.22javascriptwindow.open.28....29.22_....3E" name="N.27utilisez_jamais_ce_format_de_code_pour_les_liens_:.3Ca_href.3D.22javascript:window.open.28....29.22_....3E">N'utilisez <em>jamais</em> ce format de code pour les liens :<br> + <code><a href="javascript:window.open(...)" ...></code></h5> + +<p>Les liens « javascript: » sont toujours mauvais pour l'accessibilité et l'utilisabilité des pages Web dans tous les navigateurs.</p> + +<ul> + <li>Les pseudo-liens « javascript:» ne fonctionnent plus du tout lorsque la gestion de JavaScript est désactivée ou inexistante. Certaines sociétés n'autorisent leurs employés à utiliser le Web que suivant des politiques de sécurité très strictes : JavaScript désactivé, pas de Java, pas d'ActiveX, pas de Flash. Pour diverses raisons (sécurité, accès public, navigateurs texte, etc.), environ 5% à 10% des utilisateurs naviguent sur le Web avec JavaScript désactivé.</li> + <li>Les liens « javascript: » interfèrent avec les fonctionnalités avancées de la navigation par onglets : entre autres, le clic du milieu sur des liens, le raccourci Ctrl+clic sur un lien, les fonctions de certaines extensions, etc.</li> + <li>Les liens « javascript: » interfèrent avec le processus d'indexation des pages Web par les moteurs de recherche.</li> + <li>Les liens « javascript: » interfèrent avec les technologies d'assistance (par exemple les lecteurs vocaux) et diverses applications utilisant le Web (par exemple les <abbr title="Personal Digital Assistant (assistant personnel numérique)">PDA</abbr> ou les navigateurs pour mobiles).</li> + <li>Les liens « javascript: » interfèrent également avec les fonctionnalités de « mouse gestures » proposées par certains navigateurs.</li> + <li>Le schéma de protocole « javascript: » sera rapporté comme une erreur par les validateurs et vérificateurs de liens.</li> +</ul> + +<p><strong>Plus d'informations à ce sujet :</strong></p> + +<ul> + <li><a class="external" href="http://www.useit.com/alertbox/20021223.html">Top Ten Web-Design Mistakes of 2002</a>, 6. JavaScript in Links, Jakob Nielsen, Décembre 2002</li> + <li><a class="external" href="http://www.evolt.org/article/Links_and_JavaScript_Living_Together_in_Harmony/17/20938/">Links & JavaScript Living Together in Harmony</a>, Jeff Howden, Février 2002</li> + <li><a class="external" href="http://jibbering.com/faq/#FAQ4_24">FAQ de la discussion dans le newsgroup comp.lang.javascript sur les liens "javascript:"</a></li> +</ul> + +<h5 id="N.27utilisez_jamais_.3Ca_href.3D.22.23.22_onclick.3D.22window.open.28....29.3B.22.3E" name="N.27utilisez_jamais_.3Ca_href.3D.22.23.22_onclick.3D.22window.open.28....29.3B.22.3E">N'utilisez jamais <code><a href="#" onclick="window.open(...);"></code></h5> + +<p>Un tel pseudo-lien met également en péril l'accessibilité des liens. <strong>Utilisez toujours une véritable URL pour la valeur de l'attribut href</strong>, afin que si JavaScript s'avère désactivé ou absent, ou si le navigateur ne peut pas ouvrir de fenêtre secondaire (comme Microsoft Web TV, les navigateurs en mode texte, etc.), de tels navigateurs pourront toujours charger la référence référencée dans leur mode de chargement/gestion de nouvelles ressources par défaut. Cette forme de code interfère également avec les fonctionnalités avancées de navigation par onglets de certains navigateurs, comme le clic du milieu et les raccourcis Ctrl+clic et Ctrl+Entrée sur les liens, les « mouse gestures », etc.</p> + +<h5 id="Identifiez_toujours_les_liens_qui_cr.C3.A9eront_.28ou_r.C3.A9utiliseront.29_une_nouvelle_fen.C3.AAtre_secondaire" name="Identifiez_toujours_les_liens_qui_cr.C3.A9eront_.28ou_r.C3.A9utiliseront.29_une_nouvelle_fen.C3.AAtre_secondaire">Identifiez toujours les liens qui créeront (ou réutiliseront) une nouvelle fenêtre secondaire</h5> + +<p>Identifiez les liens qui ouvriront de nouvelles fenêtre de manière à aider les utilisateurs en utilisant l'attribut <code>title</code> du lien, en ajoutant une icône à la fin du lien, ou en modifiant le curseur de la souris.</p> + +<p>Le but est d'avertir les utilisateurs à l'avance des changements de contexte pour réduire la confusion de leur part : changer la fenêtre courante ou afficher subitement une nouvelle fenêtre peut être très désorientant pour certains utilisateurs (le bouton Précédent devient inutilisable).</p> + +<blockquote> +<p>« Souvent, les utilisateurs ne remarquent pas qu'une nouvelle fenêtre s'est ouverte, particulièrement si ils utilisent un petit écran où les fenêtres sont agrandies pour utiliser toute la surface de l'écran. Ainsi, l'utilisateur voulant retourner à la page initiale sera dérouté par un bouton<em>Précédente</em> grisé. »<br> + citation de <a class="external" href="http://www.useit.com/alertbox/990530.html">The Top Ten<em>New</em> Mistakes of Web Design</a>: 2. Opening New Browser Windows, Jakob Nielsen, mai 1999</p> +</blockquote> + +<p>Lorsque des changements complets de contexte sont identifiés explicitement avant qu'ils se produisent, l'utilisateur peut déterminer s'il désire le faire ou s'y préparer : non seulement il ne sera pas perturbé ni désorienté, mais des utilisateurs plus expérimentés pourront eux-mêmes décider comment ouvrir de tels liens (dans une nouvelle fenêtre ou non, dans la même fenêtre, dans un nouvel onglet ou non, en arrière-plan ou non).</p> + +<p><strong>Références</strong></p> + +<ul> + <li>« Si votre lien crée une nouvelle fenêtre, ou fait apparaitre d'autres fenêtres sur votre affichage, ou déplace le focus du système vers un autre cadre ou une autre fenêtre, alors la chose sympathique à faire est d'indiquer à l'utilisateur que quelque chose de ce genre va se produire. » <a class="external" href="http://www.w3.org/WAI/wcag-curric/sam77-0.htm">World Wide Web Consortium Accessibility Initiative regarding popups</a></li> + <li>« Utilisez les titres de liens pour donner aux utilisateurs un aperçu d'où chaque lien les emmènera, avant qu'ils aient cliqué dessus. » <a class="external" href="http://www.useit.com/alertbox/991003.html">Ten Good Deeds in Web Design</a>, Jakob Nielsen, octobre 1999</li> + <li><a class="external" href="http://www.useit.com/alertbox/980111.html">Using Link Titles to Help Users Predict Where They Are Going</a>, Jakob Nielsen, janvier 1998</li> +</ul> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header" colspan="4">Exemples de curseurs et icônes « Nouvelle fenêtre »</td> + </tr> + <tr> + <td style="width: 25%;"></td> + <td style="width: 25%;"></td> + <td style="width: 25%;"></td> + <td style="width: 25%;"></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td colspan="2"></td> + <td colspan="2"></td> + </tr> + </tbody> +</table> + +<h5 id="Utilisez_toujours_l.27attribut_target" name="Utilisez_toujours_l.27attribut_target">Utilisez toujours l'attribut target</h5> + +<p>Si JavaScript est désactivé ou absent, le navigateur créera une fenêtre secondaire ou affichera la ressource demandée selon sa gestion habituelle de l'attribut target : par exemple certains navigateurs ne pouvant pas créer de nouvelles fenêtres comme Microsoft Web TV, chargeront la ressource demandée et l'ajouteront à la fin du document courant. Le but et l'idée est d'essayer de fournir — <strong>sans l'imposer</strong> — à l'utilisateur une manière d'ouvrir la ressource référencée, de suivre le lien. Votre code ne doit pas interférer avec les fonctionnalités du navigateur à disposition de l'utilisateur, et doit toujours lui laisser le chemin libre et le choix de la décision finale.</p> + +<h5 id="N.27utilisez_pas_target.3D.22_blank.22" name="N.27utilisez_pas_target.3D.22_blank.22">N'utilisez pas <code>target="_blank"</code></h5> + +<p>Fournissez toujours un nom significatif dans votre attribut target, et essayez de le réutiliser dans votre page afin qu'un clic sur un autre lien puisse charger la ressource dans une fenêtre déjà utilisée (ce qui rend l'opération beaucoup plus rapide pour l'utilisateur), ce qui justifie la raison (et les ressources système, et le temps dépensé) d'avoir créé une fenêtre secondaire. Utiliser une seule cible et la réutiliser pour plusieurs liens est bien moins gourmand en matière de ressources puisqu'une seule fenêtre est créée et recyclée. D'un autre côté, utiliser « _blank » comme attribut target créera plusieurs nouvelles fenêtre anonymes sur le bureau de l'utilisateur qui ne peuvent ni être recyclées ni réutilisées.</p> + +<p>Dans tous les cas, si votre code est bien fait, il ne devrait pas interférer avec le choix final de l'utilisateur mais lui offrira plutôt des choix supplémentaires, plus de façons d'ouvrir les liens et plus de pouvoir sur l'outil qu'il utilise (son navigateur).</p> + +<h3 id="Glossaire" name="Glossaire">Glossaire</h3> + +<dl> + <dt>Fenêtre ouvrante, opener, fenêtre parente, fenêtre principale, première fenêtre </dt> + <dd>Termes souvent utilisés pour décrire ou identifier la même fenêtre. Il s'agit de la fenêtre depuis laquelle une nouvelle fenêtre sera créée. C'est la fenêtre dans laquelle l'utilisateur clique sur un lien qui mène à la création d'une autre, nouvelle fenêtre.</dd> +</dl> + +<dl> + <dt>Sous-fenêtre, fenêtre enfant, fenêtre secondaire, deuxième fenêtre </dt> + <dd>Termes souvent utilisés pour décrire ou identifier la même fenêtre. C'est la nouvelle fenêtre qui a été créée.</dd> +</dl> + +<dl> + <dt>Fenêtres popup non sollicitées </dt> + <dd>Ouverture automatique de fenêtres initiée par un script sans le consentement de l'utilisateur.</dd> +</dl> + +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> + +<p>{{ DOM0() }} <code>window.open()</code> ne fait partie d'aucune spécification ou recommandation technique du <abbr title="World Wide Web Consortium">W3C</abbr>.</p> + +<h3 id="Notes" name="Notes">Notes</h3> + +<h4 id="Note_sur_les_priorit.C3.A9s" name="Note_sur_les_priorit.C3.A9s">Note sur les priorités</h4> + +<p>Dans les cas où <code>left</code> et <code>screenX</code> (et/ou <code>top</code> et <code>screenY</code>) ont des valeurs contradictoires, <code>left</code> et <code>top</code> ont priorité sur <code>screenX</code> et <code>screenY</code> respectivement. Si <code>left</code> et <code>screenX</code> (et/ou <code>top</code> et <code>screenY</code>) sont définies dans la liste <var>strWindowFeatures</var>, les valeurs <code>left</code> (et/ou <code>top</code>) seront reconnues et utilisées. Dans l'exemple suivant, la nouvelle fenêtre sera positionnée à 100 pixels du bord gauche de la zone de travail des applications du système d'exploitation de l'utilisateur, et non à 200 pixels.</p> + +<pre><script type="text/javascript"> +WindowObjectReference = window.open("http://www.lemonde.fr/", + "NomDeLaFenetreLeMonde", + "left=100,screenX=200,resizable,scrollbars,status"); +</script> +</pre> + +<p>Si <code>left</code> est défini, mais que <code>top</code> n'a aucune valeur mais que <code>screenY</code> en a une, <code>left</code> et <code>screenY</code> seront les coordonnées de positionnement de la fenêtre secondaire.</p> + +<p><code>outerWidth</code> a priorité sur <code>width</code>, et <code>width</code> a priorité sur <code>innerWidth</code>. <code>outerHeight</code> a priorité sur <code>height</code> et <code>height</code> a priorité sur <code>innerHeight</code>. Dans l'exemple suivant, les navigateurs basés sur Mozilla créeront une nouvelle fenêtre avec une taille extérieure (outerWidth) de 600 pixels de large et ignoreront la requête d'une largeur (width) de 500 pixels ainsi que celle d'une taille intérieure (innerWidth) de 400 pixels.</p> + +<pre><script type="text/javascript"> +WindowObjectReference = window.open("http://www.wwf.org/", + "NomDeLaFenetreWWF", + "outerWidth=600,width=500,innerWidth=400,resizable,scrollbars,status"); +</script> +</pre> + +<h4 id="Note_sur_les_corrections_d.27erreurs_de_position_et_de_dimension" name="Note_sur_les_corrections_d.27erreurs_de_position_et_de_dimension">Note sur les corrections d'erreurs de position et de dimension</h4> + +<p>Les positions et dimensions demandées dans la liste <var>strWindowFeatures</var> ne seront pas respectées et <strong>seront corrigées</strong> si n'importe laquelle de ces valeurs ne permet pas à la fenêtre complète d'être affichée dans la zone de travail des applications du système d'exploitation de l'utilisateur. <strong>Aucune partie de la nouvelle fenêtre ne peut être initialement positionnée hors de l'écran. Ceci est le réglage par défaut de tous les navigateurs basés sur Mozilla.</strong></p> + +<p><a class="external" href="http://msdn.microsoft.com/security/productinfo/xpsp2/default.aspx?pull=/library/en-us/dnwxp/html/xpsp2web.asp#xpsp_topic5">Internet Explorer 6 SP2 dispose d'un mécanisme de correction d'erreur similaire</a>, mais celui-ci n'est pas activé par défaut pour tous les niveaux de sécurité : un niveau de sécurité trop bas peut désactiver ce mécanisme de correction d'erreurs.</p> + +<h4 id="Note_sur_les_barres_de_d.C3.A9filement" name="Note_sur_les_barres_de_d.C3.A9filement">Note sur les barres de défilement</h4> + +<p>Lorsque le contenu dépasse les dimensions de la zone de visualisation de la fenêtre, des barres de défilement (ou un mécanisme de définement similaire) sont nécessaires pour s'assurer que les utilisateurs puissent accéder au contenu. Le contenu ou la boîte du document d'une page web peut outrepasser, excéder les dimensions demandées pour la fenêtre pour plusieurs raisons qui sont hors du contrôle des auteurs Web :</p> + +<ul> + <li>l'utilisateur a redimensionné la fenêtre</li> + <li>l'utilisateur a augmenté la taille de police du texte via le menu Affichage/Taille du texte (%) dans Mozilla ou Affichage/Taille du texte/Plus grande ou Plus petite dans Firefox</li> + <li>l'utilisateur a défini une taille minimale de police pour les pages qui est plus grande que celle demandée par l'auteur. Les personnes de plus de 40 ans ou ayant des habitudes particulières de lecture choisissent souvent une taille minimale de police dans les navigateurs basés sur Mozilla.</li> + <li>l'auteur n'est pas conscient des marges par défaut (et/ou bordures et/ou padding) appliquées à l'élément racine ou nœud <code>body</code> dans les différents navigateurs et versions de ceux-ci</li> + <li>l'utilisateur utilise une feuille de style utilisateur (<a class="external" href="http://www.mozilla.org/support/firefox/edit#content">userContent.css in Mozilla-based browsers</a>) pour ses habitudes de navigation qui modifie les dimensions habituelles pour ses habitudes de lecture (marges, padding, taille de police par défaut)</li> + <li>l'utilisateur peut personnaliser individuellement la taille (hauteur ou largeur) de la plupart des barres d'outils via son système d'exploitation. Par exemple les bordures de fenêtres, la hauteur de la barre de titre, des menus et des barres de défilement, ainsi que la taille du texte sont entièrement personnalisables par l'utilisateur dans le système d'exploitation Windows XP. Ces dimensions de barres d'outils peuvent également être changées par des thèmes du navigateur, ou du système d'exploitation</li> + <li>l'auteur ne s'attend pas à ce que la fenêtre de l'utilisateur dispose de barres d'outils spécifiques supplémentaires ; comme des barres de préférences, la barre web developer, des barres d'accessibilité, de blocage de popups et de recherche, etc.</li> + <li>l'utilisateur utilise des technologies assistives ou addons qui modifient la zone de travail des applications, par exemple Microsoft Magnifier</li> + <li>l'utilisateur repositionne et/ou redimensionne directement la zone de travail des apllications : par exemple il redimensionne la barre des tâches de Windows, la place sur le côté gauche de l'écran (versions en langues arabes) ou sur la droite (versions en hébreu), l'utilisateur a une barre de lancement rapide Microsoft Office, etc.</li> + <li>certains systèmes d'exploitation (Mac OS X) forcent la présence de barres d'outils qui peuvent démentir les anticipations et calculs de l'auteur Web sur les dimensions effectives de la fenêtre de navigation</li> +</ul> + +<h4 id="Note_sur_la_barre_d.27.C3.A9tat" name="Note_sur_la_barre_d.27.C3.A9tat">Note sur la barre d'état</h4> + +<p>Vous devez vous attendre à ce qu'une large majorité des navigateurs affichent la barre d'état, ou qu'une large majorité des utilisateurs voudront forcer sa présence : le mieux est de toujours positionner cette fonctionnalité à yes. De plus, si vous demandez spécifiquement de retirer la barre d'état, les utilisateurs de Firefox ne pourront plus utilser la barre de navigation de site si elle est installée. Dans Mozilla et dans Firefox, toutes les fenêtres peuvent être redimensionnées à partir de la zone inférieure droite de la barre d'état. Celle-ci fournit également des informations sur la connexion http, l'emplacement des ressources hypertextes, la barre de progression du téléchargement, l'icône de chiffrement/connexion sécurisée avec <abbr title="Secure Socket Layer">SSL</abbr> (affichant une icône de cadenas jaune), des icônes de zones de sécurité, de politique de sécurité en matière de cookies, etc. <strong>Enlever la barre d'état retire souvent de très nombreuses fonctionnalités et informations considérées comme utiles (et parfois vitales) par les utilisateurs.</strong></p> + +<h4 id="Note_sur_les_probl.C3.A8mes_de_s.C3.A9curit.C3.A9_li.C3.A9s_.C3.A0_la_pr.C3.A9sence_de_la_barre_d.27.C3.A9tat" name="Note_sur_les_probl.C3.A8mes_de_s.C3.A9curit.C3.A9_li.C3.A9s_.C3.A0_la_pr.C3.A9sence_de_la_barre_d.27.C3.A9tat">Note sur les problèmes de sécurité liés à la présence de la barre d'état</h4> + +<p>Dans Internet Explorer 6 pour XP SP2, pour les fenêtres ouvertes à l'aide de window.open() :</p> + +<blockquote> +<p>« Pour les fenêtres ouvertes à l'aide de window.open() :<br> + Attendez-vous à ce que la barre d'état soit présente, et codez en conséquence. <strong>La barre d'état sera activée par défaut</strong> et fait entre 20 et 25 pixels de haut. (...) »<br> + citation de <a class="external" href="http://msdn.microsoft.com/security/productinfo/xpsp2/default.aspx?pull=/library/en-us/dnwxp/html/xpsp2web.asp#xpsp_topic5">Fine-Tune Your Web Site for Windows XP Service Pack 2, Browser Window Restrictions in XP SP2</a></p> +</blockquote> + +<blockquote> +<p>« (...) les fenêtres créées à l'aide de la méthode window.open() peuvent être appelées par des scripts et utilisées pour imiter une fausse interface utilisateur ou bureau, ou pour masquer des informations ou des activités malveillantes en dimensionnant la fenêtre de manière à rendre la barre d'état invisible.<br> + Les fenêtres d'Internet Explorer fournissent des informations de sécurité visibles par l'utilisateur pour l'aider à identifier avec certitude la source de la page et le niveau de sécurité de la communication avec cette page. Lorsque ces éléments ne sont pas visibles, les utilisateurs peuvent penser qu'ils sont sur une page plus digne de confiance ou interagissent avec un processus système alors qu'il sont en train d'interagir avec un hôte malveillant. (...)<br> + <strong>Les fenêtres lancées par des scripts seront affichées entièrement, avec la barre de titre d'Internet Explorer et sa barre d'état.</strong> (...)<br> + Gestion de la barre d'état d'Internet Explorer par les scripts<br> + Description détaillée<br> + <strong>Internet Explorer a été modifié pour ne désactiver la barre d'état pour aucune fenêtre. La barre d'état est toujours visible pour toutes les fenêtres d'Internet Explorer.</strong> (...) Sans ce changement, les fenêtres créées à l'aide de la méthode window.open() peuvent être appelées par des scripts et imiter une fausse interface utilisateur ou bureau, ou pour masquer des informations importantes pour l'utilisateur.<br> + La barre d'état est une fonction de sécurité des fenêtres d'Internet Explorer qui fournissent à l'utilisateur des informations sur les zones de sécurité. Cette zone ne peut pas être imitée (...)"<br> + citation de <a class="external" href="http://www.microsoft.com/technet/prodtechnol/winxppro/maintain/sp2brows.mspx#ECAA">Changes to Functionality in Microsoft Windows XP Service Pack 2, Internet Explorer Window Restrictions</a></p> +</blockquote> + +<h4 id="Note_sur_le_plein_.C3.A9cran_.28fullscreen.29" name="Note_sur_le_plein_.C3.A9cran_.28fullscreen.29">Note sur le plein écran (fullscreen)</h4> + +<p>Dans Internet Explorer 6 pour XP SP2 :</p> + +<ul> + <li>« window.open() avec fullscreen=yes donnera à présent une fenêtre maximisée, et non une fenêtre en mode kiosque. »</li> +</ul> + +<ul> + <li>« La définition de la spécification de fullscreen=yes est modifiée pour signifier "afficher la fenêtre maximisée," ce qui gardera la barre de titre, la barre d'adresse et la barre d'état visibles. »</li> +</ul> + +<p><em>Références :</em></p> + +<ul> + <li><a class="external" href="http://msdn.microsoft.com/security/productinfo/xpsp2/default.aspx?pull=/library/en-us/dnwxp/html/xpsp2web.asp#xpsp_topic5">Fine-Tune Your Web Site for Windows XP Service Pack 2</a></li> +</ul> + +<ul> + <li><a class="external" href="http://www.microsoft.com/technet/prodtechnol/winxppro/maintain/sp2brows.mspx#ECAA">Changes to Functionality in Microsoft Windows XP Service Pack 2, Script sizing of Internet Explorer windows</a></li> +</ul> + +<h4 id="Note_sur_la_diff.C3.A9rence_entre_outerHeight_et_height" name="Note_sur_la_diff.C3.A9rence_entre_outerHeight_et_height">Note sur la différence entre outerHeight et height</h4> + + + +<h3 id="Tutoriels" name="Tutoriels">Tutoriels</h3> + +<p><strong>en français :</strong></p> + +<p><a class="external" href="http://openweb.eu.org/articles/popup/">Créer des pop-up intelligentes</a> par Fabrice Bonny, OpenWeb</p> + +<p><strong>en anglais :</strong></p> + +<p><a class="external" href="http://www.infimum.dk/HTML/JSwindows.html">JavaScript windows (tutorial)</a> par Lasse Reichstein Nielsen</p> + +<p><a class="external" href="http://www.accessify.com/tutorials/the-perfect-pop-up.asp">The perfect pop-up (tutorial)</a> par Ian Lloyd</p> + +<p><a class="external" href="http://www.gtalbot.org/FirefoxSection/Popup/PopupAndFirefox.html">Popup windows and Firefox (interactive demos)</a> par Gérard Talbot</p> + +<h3 id="R.C3.A9f.C3.A9rences" name="R.C3.A9f.C3.A9rences">Références</h3> + +<p><a class="external" href="http://www.cs.tut.fi/~jkorpela/www/links.html">Links Want To Be Links</a> by Jukka K. Korpela</p> + +<p><a class="external" href="http://www.evolt.org/article/Links_and_JavaScript_Living_Together_in_Harmony/17/20938/">Links & JavaScript Living Together in Harmony</a> by Jeff Howden</p> + + + +<div class="noinclude"></div> + +<p>{{ languages( { "en": "en/DOM/window.open", "ja": "ja/DOM/window.open", "pl": "pl/DOM/window.open", "zh-cn": "cn/DOM/window.open" } ) }}</p> diff --git a/files/fr/web/api/window/opendialog/index.html b/files/fr/web/api/window/opendialog/index.html new file mode 100644 index 0000000000..1c366c5355 --- /dev/null +++ b/files/fr/web/api/window/opendialog/index.html @@ -0,0 +1,111 @@ +--- +title: window.openDialog +slug: Web/API/Window/openDialog +tags: + - DOM + - Gecko + - Window + - boîte de dialogue +translation_of: Web/API/Window/openDialog +--- +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">{{ ApiRef() }}</p> + +<h3 id="Summary" name="Summary">Résumé</h3> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;"><code style="color: rgb(37, 34, 29); font-weight: inherit;">window.openDialog</code> est une extension à <a href="/fr/DOM/window.open" title="fr/DOM/window.open">window.open()</a>. Elle s'utilise de la même manière, excepté qu'elle peut prendre plusieurs paramètres optionnels après <code style="color: rgb(37, 34, 29); font-weight: inherit;">windowFeatures</code>, et que <code style="color: rgb(37, 34, 29); font-weight: inherit;">windowFeatures</code> est traîté différemment.</p> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Les paramètres optionnels, si présents, seront regroupés dans un objet JavaScript Array et seront accessibles depuis la nouvelle fenêtre par la propriété <code>window.arguments</code>. Ils sont accessibles depuis les scripts de la fenêtre à tout moment, notamment lors du traitement d'un évênement <code style="color: rgb(37, 34, 29); font-weight: inherit;">load</code> . Ces paramètres peuvent donc être utilisés pour passer des arguments à une boîte de dialogue, et pour les récupérer ensuite.</p> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Notez que l'appel à la méthode <code style="color: rgb(37, 34, 29); font-weight: inherit;">openDialog()</code> se termine immédiatement. Si vous souhaitez le bloquer jusqu'à ce que l'utilisateur ferme la boîte de dialogue, utilisez la valeur <code style="color: rgb(37, 34, 29); font-weight: inherit;">modal</code> pour le paramètre f<code style="color: rgb(37, 34, 29); font-weight: inherit;">eatures</code>. En conséquence, l'utilisateur ne pourra pas interagir avec la fenêtre parente jusqu'à ce qu'il ferme la boîte de dialogue modale.</p> + +<h3 id="Syntax" name="Syntax">Syntaxe</h3> + +<pre class="eval"><em>newWindow</em> = openDialog(<em>url</em>, <em>name</em>, <em>features</em>, <em>arg1</em>, <em>arg2</em>, ...) +</pre> + +<dl style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;"> + <dt style="font-style: normal; font-weight: bold;">newWindow </dt> + <dd style="margin-left: 0px; margin-bottom: 20px; padding-left: 16px; border-bottom-width: 1px; border-bottom-style: dashed; margin-top: 0px; margin-right: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 4px;">La nouvelle fenêtre ouverte.</dd> + <dt style="font-style: normal; font-weight: bold;">url </dt> + <dd style="margin-left: 0px; margin-bottom: 20px; padding-left: 16px; border-bottom-width: 1px; border-bottom-style: dashed; margin-top: 0px; margin-right: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 4px;">L'URL du document à charger dans la nouvelle fenêtre.</dd> + <dt style="font-style: normal; font-weight: bold;">name </dt> + <dd style="margin-left: 0px; margin-bottom: 20px; padding-left: 16px; border-bottom-width: 1px; border-bottom-style: dashed; margin-top: 0px; margin-right: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 4px;">Le nom de la fenêtre (optionnel). Voir la description de <a href="/fr/DOM/window.open" title="fr/DOM/window.open">window.open()</a> pour plus de détails.</dd> + <dt style="font-style: normal; font-weight: bold;">features </dt> + <dd style="margin-left: 0px; margin-bottom: 20px; padding-left: 16px; border-bottom-width: 1px; border-bottom-style: dashed; margin-top: 0px; margin-right: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 4px;">Voir la description de <a href="/fr/DOM/window.open" title="fr/DOM/window.open">window.open()</a> pour la description.</dd> + <dt style="font-style: normal; font-weight: bold;">arg1, arg2, ... </dt> + <dd style="margin-left: 0px; margin-bottom: 20px; padding-left: 16px; border-bottom-width: 1px; border-bottom-style: dashed; margin-top: 0px; margin-right: 0px; padding-top: 2px; padding-right: 0px; padding-bottom: 4px;">Les arguments à passer à la nouvelle fenêtre (optionnel).</dd> +</dl> + +<h3 id="Example" name="Example">Exemple</h3> + +<pre class="brush: js">var win = openDialog("http://example.tld/zzz.xul", "dlg", "", "pizza", 6.98);</pre> + +<h3 id="Notes" name="Notes">Notes</h3> + +<h4 id="New_Features" name="New_Features">Nouvelles fonctionnalités</h4> + +<dl> + <dt><code>all</code></dt> +</dl> + +<dl> + <dd>Active ou désactive (<code>"all=no"</code>) toutes les fonctionnalités (excepté <code>chrome</code>, <code>dialog</code> et <code>modal</code>). Peut être utilisé conjointement avec les autres drapeaux (par exemple, <code>"menubar=no, all"</code> active toutes les fonctionnalités excepté <code>menubar</code>). Ce drapeau est ignorée par la méthode <a href="/fr/DOM/window.open" title="fr/DOM/window.open">window.open()</a> mais pas par window.openDialog().</dd> +</dl> + +<h4 id="Default_behaviour" name="Default_behaviour">Comportement</h4> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">La méthode <code>window.openDialog()</code> traite l'absence du paramètre <code>features</code> de la même manière que <a href="/fr/DOM/window.open" title="fr/DOM/window.open">window.open()</a> (une chaîne vide désactive toutes les fonctionnalités) excepté pour <code>chrome</code> et <code>dialog</code> qui sont activés par défaut et peuvent être explicitement désactivées par "<code style="color: rgb(37, 34, 29); font-weight: inherit;">chrome=no</code>".</p> + +<h4 id="Passing_extra_parameters_to_the_dialog" name="Passing_extra_parameters_to_the_dialog">Passage de paramètres supplémentaires</h4> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Pour passer des paramètres supplémentaires à la boîte de dialogue, vous pouvez simplement les ajouter après le paramètre f<code style="color: rgb(37, 34, 29); font-weight: inherit;">eatures</code> :</p> + +<pre class="brush: js">openDialog("http://example.tld/zzz.xul", "dlg", "", "pizza", 6.98);</pre> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Ces paramètres seront ensuite regroupés dans une propriété <code style="color: rgb(37, 34, 29); font-weight: inherit;">arguments</code> de type <a href="/en/Core_JavaScript_1.5_Reference/Global_Objects/Array" style="text-decoration: none; color: rgb(4, 137, 183) !important; cursor: default;" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Array">Array</a>, et cette propriété sera ajoutée à la nouvelle boîte de dialogue.</p> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Pour accéder à ces paramètres depuis un script de la boîte de dialogue, utilisez le procédé suivant :</p> + +<pre class="brush: js">var food = window.arguments[0]; +var price = window.arguments[1];</pre> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Notez que vous pouvez accéder à cette propriété depuis n'importe où dans le script. (<a href="/en/Code_snippets/Dialogs_and_Prompts#Passing_arguments_and_displaying_a_dialog" title="en/Code snippets/Dialogs and Prompts#Passing arguments and displaying a dialog">Autre exemple</a>).</p> + +<h4 id="Returning_values_from_the_dialog" name="Returning_values_from_the_dialog">Retourner des arguments depuis la boîte de dialogue</h4> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Depuis que <code style="color: rgb(37, 34, 29); font-weight: inherit;"><a href="/fr/DOM/window.close" title="fr/DOM/window.close">window.close()</a></code> efface toutes les propriétés associées à la boîte de dialogue (c'est-à-dire les variables spécifiées depuis le code JavaScript chargé depuis la boîte de dialogue), il n'est pas possible de retourner des valeur après la fermeture de la boîte de dialogue en utilisant des variables globales (ou toute autre méthode).</p> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Pour pouvoir retourner des valeurs à la fenêtre parente, vous devez passer un objet via les paramètres supplémentaires. Vous pouvez ensuite accéder à cet objet depuis la boîte de dialogue et modifier ces propriétés, dont les données que vous souhaiter conserver après l'appel à la méthode <code style="color: rgb(37, 34, 29); font-weight: inherit;">window.close()</code>.</p> + +<pre class="brush: js">var retVals = { address: null, delivery: null }; +openDialog("http://example.tld/zzz.xul", "dlg", "modal", "pizza", 6.98, retVals);</pre> + +<p>Si vous modifiez les propriétés de l'objet <code style="color: rgb(37, 34, 29); font-weight: inherit;">retVals</code> depuis la boîte de dialogue comme décrit précédemment, vous pouvez y accéder via le tableau <code style="color: rgb(37, 34, 29); font-weight: inherit;">retVals</code> après l'appel à <code style="color: rgb(37, 34, 29); font-weight: inherit;">openDialog()</code>.</p> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Depuis la boîte de dialogue, vous pouvez modifier les propriétés comme suit :</p> + +<pre class="brush: js">var retVals = window.arguments[2]; +retVals.address = enteredAddress; +retVals.delivery = "immediate";</pre> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">Voir aussi <a class="external" href="http://groups.google.com/group/netscape.public.dev.xul/msg/02075a1736406b40" title="http://groups.google.com/group/netscape.public.dev.xul/msg/02075a1736406b40">ce message</a>. (<a href="/en/Code_snippets/Dialogs_and_Prompts#Passing_arguments_and_displaying_a_dialog" style="text-decoration: none; color: rgb(4, 137, 183) !important; cursor: default;" title="en/Code_snippets/Dialogs_and_Prompts#Passing_arguments_and_displaying_a_dialog">Autre exemple</a>).<br> + Voir aussi <a href="/fr/DOM/window.importDialog" title="fr/DOM/window.importDialog">window.importDialog()</a>.</p> + +<h3 id="Specification" name="Specification">Spécification</h3> + +<p style="margin-top: 0px; margin-right: 0px; margin-bottom: 1.7em; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;">{{ DOM0() }}</p> + +<h3 id="Compatibilité_des_navigateurs" style="margin: 0px 0px 1.7em; padding: 0px;">Compatibilité des navigateurs</h3> + +<p>{{Compat("api.Window.openDialog")}}</p> + +<h3 id="Voir_également">Voir également</h3> + +<p> </p> + +<ul> + <li><a href="https://developer.mozilla.org/en-US/Add-ons/Code_snippets/Dialogs_and_Prompts#Passing_arguments_and_displaying_a_dialog">Another example</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Archive/Web/Window.importDialog"><code>window.importDialog</code></a> (mobile) {{obsolete_inline}}</li> +</ul> + +<p> </p> diff --git a/files/fr/web/api/window/opener/index.html b/files/fr/web/api/window/opener/index.html new file mode 100644 index 0000000000..43c965d501 --- /dev/null +++ b/files/fr/web/api/window/opener/index.html @@ -0,0 +1,27 @@ +--- +title: window.opener +slug: Web/API/Window/opener +tags: + - DOM + - DOM_0 + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/opener +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Renvoie une référence vers la fenêtre qui a ouvert la fenêtre courante.</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre class="eval"><i>refObj</i> = window.opener +</pre> +<h3 id="Exemple" name="Exemple">Exemple</h3> +<pre> if window.opener != indexWin { + referToTop(window.opener); + } +</pre> +<h3 id="Notes" name="Notes">Notes</h3> +<p>Lorsqu'une fenêtre est ouverte depuis une autre fenêtre, elle conserve une référence à cette première fenêtre dans <b>window.opener</b>. Si la fenêtre courante n'a pas été ouverte par une autre fenêtre, la méthode renvoie <code>null</code>.</p> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>{{ DOM0() }}</p> +<div class="noinclude"> + </div> +<p>{{ languages( { "en": "en/DOM/window.opener", "ja": "ja/DOM/window.opener", "pl": "pl/DOM/window.opener" } ) }}</p> diff --git a/files/fr/web/api/window/orientation/index.html b/files/fr/web/api/window/orientation/index.html new file mode 100644 index 0000000000..fb06ea1c88 --- /dev/null +++ b/files/fr/web/api/window/orientation/index.html @@ -0,0 +1,37 @@ +--- +title: Window.orientation +slug: Web/API/Window/orientation +translation_of: Web/API/Window/orientation +--- +<div>{{APIRef}}{{deprecated_header}}</div> + +<h2 id="Résumé">Résumé</h2> + +<p>Renvoie l'orientation en degrés (par incréments de 90 degrés) de la fenêtre par rapport à l'orientation naturelle de l'appareil.</p> + +<p>Les seules valeurs possibles sont <code>-90</code>, <code>0</code>, <code>90</code>, et <code>180</code>. Les valeurs positives sont dans le sens des aiguilles d'une montre; les valeurs négatives sont dans le sens antihoraire.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Compat', '#dom-window-orientation', 'Window.orientation')}}</td> + <td>{{Spec2('Compat')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden"><span class="tlid-translation translation" lang="fr"><span title="">Le tableau de compatibilité de cette page est généré à partir de données structurées.</span> <span title="">Si vous souhaitez contribuer aux données, veuillez consulter</span></span> <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et nous envoyer une pull request.</div> + +<p>{{Compat("api.Window.orientation")}}</p> diff --git a/files/fr/web/api/window/outerheight/index.html b/files/fr/web/api/window/outerheight/index.html new file mode 100644 index 0000000000..9dab0e95d3 --- /dev/null +++ b/files/fr/web/api/window/outerheight/index.html @@ -0,0 +1,110 @@ +--- +title: Window.outerHeight +slug: Web/API/Window/outerHeight +translation_of: Web/API/Window/outerHeight +--- +<div>{{APIRef}}</div> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p><code>Window.outerHeight</code> retourne la hauteur de la fenêtre (du navigateur) en pixels. La hauteur retournée prends en compte la fenêtre du navigateur entier, y compris la barre latérale, window chrome and window resizing borders/handles.</p> + +<p>Cette propriété n'a pas de valeur par défaut.</p> + +<p>Syntaxe</p> + +<pre class="syntaxbox"><var>outWindowHeight</var> = window.outerHeight; +</pre> + +<p>La valeur retournée correspond à la hauteur extérieure de la fenêtre.</p> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>Pour changer la taille de la fenêtre, utilisez {{domxref("window.resizeBy()")}} et {{domxref("window.resizeTo()")}}.</p> + +<p>Pour obtenir la hauteur intérieure de la fenêtre (la hauteur de la page actuelle), utilisez {{domxref("window.innerHeight")}}.</p> + +<h3 id="Graphical_example" name="Graphical_example">Exemple illustré</h3> + +<p>La figure suivante montre la différence entre <code>outerHeight</code> et <code>innerHeight</code>.</p> + +<p><img alt="innerHeight vs outerHeight illustration" src="/@api/deki/files/213/=FirefoxInnerVsOuterHeight2.png"></p> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité des navigateurs</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatGeckoDesktop(1.0)}}</td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatGeckoMobile(1.0)}}</td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Specification" name="Specification">Specification</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('CSSOM View', '#dom-window-outerheight', 'Window.outerHeight') }}</td> + <td>{{ Spec2('CSSOM View') }}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("window.innerHeight")}}</li> + <li>{{domxref("window.innerWidth")}}</li> + <li>{{domxref("window.outerWidth")}}</li> + <li>{{domxref("window.resizeBy()")}}</li> + <li>{{domxref("window.resizeTo()")}}</li> +</ul> diff --git a/files/fr/web/api/window/outerwidth/index.html b/files/fr/web/api/window/outerwidth/index.html new file mode 100644 index 0000000000..bb3f08e90b --- /dev/null +++ b/files/fr/web/api/window/outerwidth/index.html @@ -0,0 +1,111 @@ +--- +title: Window.outerWidth +slug: Web/API/Window/outerWidth +tags: + - API + - CSSOM View + - NeedsContent + - Property + - Reference +translation_of: Web/API/Window/outerWidth +--- +<div>{{APIRef}}</div> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p><code>Window.outerWidth</code> <span class="tlid-translation translation"><span class="alt-edited">récupère la largeur de l'extérieur de la fenêtre du navigateur. Elle représente la largeur de toute la fenêtre du navigateur, y compris la barre latérale (si elle est agrandie), la fenêtre chrome et le redimensionnement de la fenêtre.</span></span></p> + +<p><span class="tlid-translation translation"><span class="alt-edited">Cette propriété est en lecture seule ; elle n'a pas de valeur par défaut.</span></span></p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><var>largeurExterieureFenetre</var> = window.outerWidth; +</pre> + +<p>Lors du retour, <code>largeurExterieureFenetre</code> vaut la largeur de l'extérieur de la fenêtre.</p> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p><span class="tlid-translation translation"><span class="alt-edited">Pour changer la taille d'une fenêtre, voir {{domxref("window.resizeBy()")}} et {{domxref("window.resizeTo ()")}}.</span></span></p> + +<p><span class="tlid-translation translation"><span class="alt-edited">Pour récupérer la largeur interne d'une fenêtre, c'est-à-dire la largeur de la page affichée, voir {{domxref ("window.innerWidth")}}.</span></span></p> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop(1.0)}}</td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>1</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile(1.0)}}</td> + <td>9</td> + <td>9</td> + <td>3</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('CSSOM View', '#dom-window-outerwidth', 'Window.outerWidth') }}</td> + <td>{{ Spec2('CSSOM View') }}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("window.outerHeight")}}, {{domxref("window.innerHeight")}}, {{domxref("window.innerWidth")}}</li> + <li>{{domxref("window.resizeBy()")}}, {{domxref("window.resizeTo()")}}</li> +</ul> diff --git a/files/fr/web/api/window/parent/index.html b/files/fr/web/api/window/parent/index.html new file mode 100644 index 0000000000..f45781f517 --- /dev/null +++ b/files/fr/web/api/window/parent/index.html @@ -0,0 +1,25 @@ +--- +title: window.parent +slug: Web/API/Window/parent +tags: + - DOM + - DOM_0 + - Référence_du_DOM_Gecko +translation_of: Web/API/Window/parent +--- +<p>{{ ApiRef() }}</p> +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> +<p>Renvoie une référence à la fenêtre parente ou cadre parent de la fenêtre courante ou du cadre courant.</p> +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<pre class="eval"><i>refObj</i> = window.parent +</pre> +<h3 id="Exemple" name="Exemple">Exemple</h3> +<pre class="eval">if (window.parent != window.top) { + // on se trouve dans une imbrication de cadres +} +</pre> +<h3 id="Notes" name="Notes">Notes</h3> +<p>Si une fenêtre n'a pas de parent, sa propriété <b>parent</b> est une référence vers elle-même.</p> +<p>Lorsqu'une fenêtre est chargée dans un ensemble de cadres (frameset), son parent est le cadre parent (c'est-à-dire le document dans lequel se trouve l'élément <code><frame></code> qui fait référence à la fenêtre).</p> +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<p>{{ DOM0() }}</p> diff --git a/files/fr/web/api/window/paste_event/index.html b/files/fr/web/api/window/paste_event/index.html new file mode 100644 index 0000000000..f06204f102 --- /dev/null +++ b/files/fr/web/api/window/paste_event/index.html @@ -0,0 +1,73 @@ +--- +title: 'Window: paste event' +slug: Web/API/Window/paste_event +tags: + - Evènement + - Reference + - Window + - paste +translation_of: Web/API/Window/paste_event +--- +<div>{{APIRef}}</div> + +<p><span class="seoSummary">L'événement <strong><code>paste</code></strong> est déclenché lorsque l'utilisateur a lancé une action de "paste" via l'interface utilisateur du navigateur.</span></p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Yes</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Yes</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("ClipboardEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété du gestionnaire d'événements</th> + <td>{{domxref("HTMLElement/onpaste", "onpaste")}}</td> + </tr> + </tbody> +</table> + +<p><span class="tlid-translation translation" lang="fr"><span title="">La cible d'origine de cet événement est le {{domxref ("Element")}} qui était la cible prévue de l'action de collage</span></span>. Vous pouvez écouter cet événement sur l'interface {{domxref ("Window")}} pour le gérer dans les phases de capture ou de bullage. Pour plus de détails sur cet événement, veuillez consulter la page sur le <a href="/en-US/docs/Web/API/Element/paste_event">Element: paste event</a>.</p> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js notranslate">window.addEventListener('paste', (event) => { + console.log('paste action initiated') +});</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Statut</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Clipboard API', '#clipboard-event-paste')}}</td> + <td>{{Spec2('Clipboard API')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.paste_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>Événements liés: {{domxref("Window/cut_event", "cut")}}, {{domxref("Window/copy_event", "copy")}}</li> + <li>Cet événement sur {{domxref("Element")}} cible: {{domxref("Element/paste_event", "paste")}}</li> + <li>Cet événement sur {{domxref("Document")}} cible: {{domxref("Document/paste_event", "paste")}}</li> +</ul> diff --git a/files/fr/web/api/window/popstate_event/index.html b/files/fr/web/api/window/popstate_event/index.html new file mode 100644 index 0000000000..98725fa936 --- /dev/null +++ b/files/fr/web/api/window/popstate_event/index.html @@ -0,0 +1,143 @@ +--- +title: popstate +slug: Web/API/Window/popstate_event +translation_of: Web/API/Window/popstate_event +--- +<p>L'événement <code>popstate</code> est exécuté lorsque l'entrée active de l'historique change. Si l'entrée active de l'historique en cours d'activation a été créé par un appel à <code>history.pushState()</code> ou a été affectée par un appel à <code>history.replaceState()</code>, la propriété <code>state</code> de l'événement <code>popstate</code> contient une copie de l'objet <code>state</code> de l'entrée d'historique.</p> + +<p>Notez qu'un appel à <code>history.pushState()</code> ou <code>history.replaceState()</code> n'exécutera pas l'événement <code>popstate</code>. L'événement <code>popstate</code> est uniquement exécuté en réalisant une action dans le navigateur telle que cliquer sur le bouton de retour (ou appeler <code>history.back()</code> en JavaScript).</p> + +<p>Les navigateurs ont tendance à gérer l'événement <code>popstate</code> différemment lors du chargement de la page. Chrome (avant la v34) et Safari émettent toujours un événement <code>popstate</code> lors du chargement de la page, contrairement à Firefox.</p> + +<h2 id="Informations_générales">Informations générales</h2> + +<dl> + <dt style="float: left; text-align: right; width: 120px;">Specification</dt> + <dd style="margin: 0 0 0 120px;"><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#event-popstate">HTML5</a></dd> + <dt style="float: left; text-align: right; width: 120px;">Interface</dt> + <dd style="margin: 0 0 0 120px;">PopStateEvent</dd> + <dt style="float: left; text-align: right; width: 120px;">Bubbles</dt> + <dd style="margin: 0 0 0 120px;">Yes</dd> + <dt style="float: left; text-align: right; width: 120px;">Cancelable</dt> + <dd style="margin: 0 0 0 120px;">No</dd> + <dt style="float: left; text-align: right; width: 120px;">Target</dt> + <dd style="margin: 0 0 0 120px;">defaultView</dd> + <dt style="float: left; text-align: right; width: 120px;">Action par défaut</dt> + <dd style="margin: 0 0 0 120px;">None</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Property</th> + <th scope="col">Type</th> + <th scope="col">Description</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>target</code> {{readonlyInline}}</td> + <td>{{domxref("EventTarget")}}</td> + <td>The browsing context (<code>window</code>).</td> + </tr> + <tr> + <td><code>type</code> {{readonlyInline}}</td> + <td>{{domxref("DOMString")}}</td> + <td>The type of event.</td> + </tr> + <tr> + <td><code>bubbles</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event normally bubbles or not.</td> + </tr> + <tr> + <td><code>cancelable</code> {{readonlyInline}}</td> + <td>{{jsxref("Boolean")}}</td> + <td>Whether the event is cancellable or not.</td> + </tr> + <tr> + <td><code>state</code> {{readonlyInline}}</td> + <td><em>any</em></td> + <td>The current history entry's state object (if any).</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Supportbasique</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("2")}}</td> + <td>10.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}[1]</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalité</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Support basique</td> + <td>3.0[2]</td> + <td>{{CompatGeckoMobile("2")}}</td> + <td>10.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}[1]</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] L'implémentation est supportée de façon limitée.</p> + +<p>[2] L'implémentation sous Android 2.2 et 2.3 était buggée.</p> + +<h2 id="Exemple">Exemple</h2> + +<p>Une page <code>http://example.com/example.html</code> exécutant le code suivant génèrera un journal comme spécifié :</p> + +<pre class="brush: js">window.onpopstate = function(event) { + console.log("location: " + document.location + ", state: " + JSON.stringify(event.state)); +}; +history.pushState({page: 1}, "title 1", "?page=1"); +history.pushState({page: 2}, "title 2", "?page=2"); +history.replaceState({page: 3}, "title 3", "?page=3"); +history.back(); // Logs "location: http://example.com/example.html?page=1, state: {"page":1}" +history.back(); // Logs "location: http://example.com/example.html, state: null +history.go(2); // Logs "location: http://example.com/example.html?page=3, state: {"page":3} +</pre> + +<p>Notez que même si l'entrée d'historique originelle (pour <code>http://example.com/example.html</code>) n'a pas d'objet state associé, un événement <code>popstate</code> est tout de même exécuté lorsque nous activons cette entrée au second appel à <code>history.back()</code>.</p> + +<h2 id="Événements_liés">Événements liés</h2> + +<ul> + <li><a href="/en-US/docs/Mozilla_event_reference/hashchange"><code>hashchange</code></a></li> +</ul> diff --git a/files/fr/web/api/window/postmessage/index.html b/files/fr/web/api/window/postmessage/index.html new file mode 100644 index 0000000000..9c4e349959 --- /dev/null +++ b/files/fr/web/api/window/postmessage/index.html @@ -0,0 +1,179 @@ +--- +title: Window.postMessage +slug: Web/API/Window/postMessage +tags: + - API + - DOM + - Méthode + - Reference + - postMessage +translation_of: Web/API/Window/postMessage +--- +<div>{{ ApiRef() }}</div> + +<div></div> + +<p>La méthode <strong><code>window.postMessage</code></strong> permet une communication inter-domaine en toute sécurité. Normalement, les scripts de différentes pages sont autorisés à accéder les uns aux autres si et seulement si les pages depuis lesquelles ils sont exécutés ont des URL de même <a href="/en-US/docs/Glossary/Origin">origine</a>, c'est-à-dire avec le même protocole (généralement <code>http</code> ou <code>https</code>), le même numéro de port (<code>80</code> étant le port par défaut pour <code>http</code>), et le même nom d'hôte (à condition que <a href="/en-US/docs/DOM/document.domain" title="DOM/document.domain">document.domain</a> soit initialisé à la même valeur par les deux pages). <code>window.postMessage</code> fournit un mécanisme contrôlé pour contourner cette restriction d'une manière sécurisée si bien utilisée.</p> + +<p>La méthode <code>window.postMessage</code>, quand elle est appelée, provoque l'envoi d'un {{domxref("MessageEvent")}} à la fenêtre ciblée une fois que tout script en attente a terminé son exécution (par exemple, les gestionnaires d'évènements restants si <code>window.postMessage</code> est appelée depuis un gestionnaire d'évènement, des timeouts en attente enregistrées auparavant, etc.) Le {{domxref("MessageEvent")}} est de type <code>message</code>, a une propriété <code>data</code> qui est initialisée à la valeur du premier argument passé à<code> window.postMessage</code>, une propriété <code>origin</code> correspondant à l'origine du document principal de la fenêtre appelant <code>window.postMessage</code> au moment où <code>window.postMessage</code> a été appelée, et une propriété <code>source</code> qui est la fenêtre depuis laquelle <code>window.postMessage</code> est appelée. (les autres propriétés standard d'évènement sont présentes avec leurs valeurs attendues).</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><em>otherWindow</em>.postMessage(<em>message</em>, <em>targetOrigin</em>, [<em>transfer</em>]);</pre> + +<dl> + <dt><code><em>otherWindow</em></code></dt> + <dd>Une référence à une autre fenêtre ; une telle référence peut être obtenue, par exemple, <em>via</em> la propriété <code>contentWindow</code> d'un élément <code>iframe</code>, l'objet retourné par <a href="/fr/docs/DOM/window.open" title="DOM/window.open">window.open</a>, ou par index nommé ou numérique de <a href="/fr/docs/Web/API/window.frames" title="DOM/window.frames">window.frames</a>.</dd> + <dt><code><em>message</em></code></dt> + <dd>La donnée à envoyer à l'autre fenêtre. Elle est sérialisée en utilisant <a href="/fr/docs/Web/Guide/API/DOM/The_structured_clone_algorithm" title="DOM/The structured clone algorithm">l'algorithme de clônage structuré</a>. Cela signifie que vous pouvez passer sereinement une large variété d'objets de données à la fenêtre de destination sans avoir à les sérialiser vous-mêmes. [1]</dd> + <dt><code><em>targetOrigin</em></code></dt> + <dd>Indique quelle doit être l'origine de <code>otherWindow</code> pour l'évènement à envoyer, soit comme la chaîne littérale <code>"*"</code> (signifiant pas de préférence) soit comme une URI. Si, au moment où l'évènement est inscrit pour être envoyé, le protocole, le nom d'hôte ou le port du document de <code>otherWindow</code> ne correspond pas à ceux contenus dans <code>targetOrigin</code>, l'évènement ne sera pas envoyé ; il ne le sera que si les trois correspondent. Ce mécanisme permet de contrôler où les messages sont envoyés ; par exemple, si <code>postMessage</code> était utilisé pour transmettre un mot de passe, il serait absolument vital que cet argument soit une URI dont l'origine est la même que le récepteur prévu du message contenant le mot de passe, afin de prévenir l'interception du mot de passe par une tierce-partie malicieuse. <strong>Fournissez toujours une <code>targetOrigin</code> spécifique, jamais <code>*</code>, si vous savez où le document de l'autre fenêtre est censé se trouver. Ne pas fournir une cible spécifique expose les données que vous envoyez à tout site malicieux à l'écoute.</strong></dd> + <dt><code><em><strong>transfer</strong></em></code> {{optional_Inline}}</dt> + <dd>Séquence d'objets {{domxref("Transferable")}} qui sera transmise avec le message. La possession de ces objets est cédée à la destination et ils ne sont plus utilisables du côté de l'expéditeur.</dd> +</dl> + +<h2 id="The_dispatched_event" name="The_dispatched_event">L'évènement envoyé</h2> + +<p><code>otherWindow</code> peut surveiller les messages envoyés en exécutant le JavaScript suivant :</p> + +<pre class="brush: js">window.addEventListener("message", receiveMessage, false); + +function receiveMessage(event) +{ + if (event.origin !== "http://example.org:8080") + return; + + // ... +} +</pre> + +<p>Les propriétés du message envoyé sont :</p> + +<dl> + <dt><code>data</code></dt> + <dd>L'objet passé depuis l'autre fenêtre.</dd> + <dt><code>origin</code></dt> + <dd>L'<a href="/en-US/docs/Origin" title="Origin">origine</a> de la fenêtre qui a envoyé le message au moment où <code>postMessage</code> a été appelée. Des exemples typiques d'origines sont <code><span class="nowiki">https://example.org</span></code> (sous-entendu port <code>443</code>), <code><span class="nowiki">http://example.net</span></code> (sous-entendu port <code>80</code>), et <code><span class="nowiki">http://example.com:8080</span></code>. Notez qu'il n'est pas garanti que cette origine soit l'origine actuelle ou future de cette fenêtre, qui peut avoir été naviguée vers une adresse différente depuis l'appel à <code>postMessage</code>.</dd> + <dt><code>source</code></dt> + <dd>Une référence à l'objet <code><a href="/fr/docs/DOM/window" title="DOM/window">window</a></code> qui a envoyé le message ; vous pouvez utiliser ceci pour établir une communication dans les deux sens entre deux fenêtres ayant différentes origines.</dd> +</dl> + +<dl> +</dl> + +<h2 id="Security_concerns" name="Security_concerns">Précautions de sécurité</h2> + +<p><strong>Si vous ne prévoyez pas de recevoir de messages depuis d'autres sites, n'ajoutez pas de gestionnaire d'évènement pour les évènements <code>message</code>.</strong> C'est un moyen sûr d'éviter les problèmes de sécurité.</p> + +<p>Si vous prévoyez de recevoir des messages depuis d'autres sites, <strong>vérifiez toujours l'identité de l'expéditeur</strong> à l'aide des propriétés <code>origin</code> et si possible <code>source</code>. Toute fenêtre (y compris, par exemple, <code><span class="nowiki">http://evil.example.com</span></code>) peut envoyer un message à toute autre fenêtre, et vous n'avez aucune garantie qu'un expéditeur inconnu ne va pas envoyer de message malicieux. Cependant, même si vous vérifiez l'identité, vous devriez <strong>toujours vérifier la syntaxe du message reçu</strong>. Dans le cas contraire, une faille de sécurité dans le site auquel vous faites confiance peut ouvrir une vulnérabilité XSS dans votre propre site.</p> + +<p><strong>Spécifiez toujours explicitement une origine de destination, jamais <code>*</code>, quand vous utilisez <code>postMessage</code> pour envoyer des données à d'autres fenêtres.</strong> Un site malicieux peut changer l'adresse de la fenêtre à votre insu, et ainsi intercepter les données envoyées à l'aide de <code>postMessage</code>.</p> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush: js">/* + * Dans les scripts de la fenêtre A, avec A sur <http://example.com:8080>: + */ + +var popup = window.open(...popup details...); + +// Quand la popup est chargée, si pas bloquée par un bloqueur de popups: + +// Ceci ne fait rien, en supposant que la fenêtre n'a pas changé d'adresse. +popup.postMessage("The user is 'bob' and the password is 'secret'", + "https://secure.example.net"); + +// Ceci va planifier l'envoi d'un message à la popup, en supposant que +// la fenêtre n'a pas changé d'adresse. +popup.postMessage("hello there!", "http://example.org"); + +function receiveMessage(event) +{ + // Faisons-nous confiance à l'expéditeur de ce message ? (il pourrait être + // différent de la fenêtre que nous avons ouverte au départ, par exemple). + if (event.origin !== "http://example.org") + return; + + // event.source est la popup + // event.data est "hi there yourself! the secret response is: rheeeeet!" +} +window.addEventListener("message", receiveMessage, false); +</pre> + +<pre class="brush: js">/* + * Dans les scripts de la popup, sur <http://example.org>: + */ + +// Appelée quelques instants après que postMessage a été appelée +function receiveMessage(event) +{ + // Faisons-nous confiance à l'expéditeur de ce message ? + if (event.origin !== "http://example.com:8080") + return; + + // event.source est window.opener + // event.data est "hello there!" + + // Supposant que vous avez vérifié l'origine du message reçu + // (ce que vous devriez faire en toutes circonstances), + // un moyen pratique de répondre à un message est d'appeler postMessage + // sur event.source et fournir event.origin comme targetOrigin. + event.source.postMessage("hi there yourself! the secret response " + + "is: rheeeeet!", + event.origin); +} + +window.addEventListener("message", receiveMessage, false); +</pre> + +<h3 id="Notes" name="Notes">Notes</h3> + +<p>Toute fenêtre peut accéder à cette méthode sur toute autre fenêtre, à tout moment, peu importe l'adresse du document dans la fenêtre, pour y envoyer un message. Par conséquent, tout gestionnaire d'évènement utilisé pour recevoir des messages <strong>doit</strong> d'abord vérifier l'identité de l'expéditeur du message, en utilisant les propriétés <code>origin</code> et si possible <code>source</code>. Cela ne peut pas être minimisé : <strong>ne pas vérifier les propriétés <code>origin</code> et si possible <code>source</code> permet des attaques inter-site.</strong></p> + +<p>De même qu'avec les scripts exécutés de manière asynchrone (timeouts, evènements générés par l'utilisateur), il n'est pas possible pour l'appelant à <code>postMessage</code> de détecter quand un gestionnaire d'évènement écoutant des évènements envoyés par <code>postMessage</code> lance une exception.</p> + +<p>La valeur de la propriété <code>origin</code> de l'évènement envoyé n'est pas affectée par la valeur actuelle de <code>document.domain</code> dans la fenêtre appelante.</p> + +<p>Pour les noms d'hôte IDN uniquement, la valeur de la propriété <code>origin</code> n'est pas systématiquement Unicode ou punycode ; pour la plus grande compatibilité, testez à la fois les valeurs IDN et punycode quand vous utilisez cette propriété si vous attendez des messages de sites IDN. Cette valeur sera systématiquement IDN à l'avenir, mais pour l'instant vous devriez gérer à la fois les formes IDN et punycode.</p> + +<p>La valeur de la propriété <code>origin</code> quand la fenêtre expéditrice contient une URL <code>javascript:</code> ou <code>data:</code> est l'origin du script qui a chargé cette URL.</p> + +<h3 id="Utiliser_window.postMessage_dans_les_extensions_Non-standard_inline">Utiliser window.postMessage dans les extensions {{Non-standard_inline}}</h3> + +<p><code>window.postMessage</code> est disponible depuis le JavaScript exécuté en code chrome (par exemple dans les extensions et le code privilégié), mais la propriété <code>source</code> de l'évènement envoyé est toujours <code>null</code> par mesure de sécurité. (Les autres propriétés ont leurs valeurs usuelles.) L'argument <code>targetOrigin</code> pour un message envoyé à une fenêtre située à une URL<code> chrome:</code> est actuellement mal interprété, si bien que la seule valeur qui conduit à l'envoi d'un message est <code>"*"</code>. Comme cette valeur n'est pas sûre quand la fenêtre ciblée peut être naviguée n'importe où par un site malicieux, il est recommandé de ne pas utiliser <code>postMessage</code> pour communiquer avec des pages <code>chrome:</code> pour l'instant ; utilisez une méthode différente (comme une query string quand la fenêtre est ouverte) pour communiquer avec des fenêtres chrome. Enfin, poster un message à une page à une URL <code>file:</code> requiert actuellement que l'argument <code>targetOrigin</code> soit <code>"*"</code>. <code>file://</code> ne peut pas être utilisé comme restriction de sécurité ; cette restriction pourrait être modifiée à l'avenir.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col"><strong>Spécification</strong></th> + <th scope="col"><strong>Status</strong></th> + <th scope="col"><strong>Comment</strong>aire</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', "#dom-window-postmessage", "window.postMessage")}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Pas de changement depuis {{SpecName('HTML5 Web Messaging')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 Web Messaging', '#dom-window-postmessage', 'window.postMessage')}}</td> + <td>{{Spec2('HTML5 Web Messaging')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + + + +<p>{{Compat("api.Window.postMessage")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/en-US/docs/DOM/document.domain" title="DOM/document.domain">Document.domain</a></li> + <li><a href="/en-US/docs/Web/API/CustomEvent" title="/en-US/docs/Web/API/CustomEvent">CustomEvent</a></li> + <li><a href="/en-US/docs/Code_snippets/Interaction_between_privileged_and_non-privileged_pages" title="/en-US/docs/Code_snippets/Interaction_between_privileged_and_non-privileged_pages">Interaction entre les pages privilégiées et non privilégiées</a></li> +</ul> diff --git a/files/fr/web/api/window/print/index.html b/files/fr/web/api/window/print/index.html new file mode 100644 index 0000000000..17eeacc763 --- /dev/null +++ b/files/fr/web/api/window/print/index.html @@ -0,0 +1,54 @@ +--- +title: Window.print() +slug: Web/API/Window/print +tags: + - API + - BesoinDeCompatibilitéAvecLeNavigateur + - BesoinDeCompatibilitéAvecLeNavigateurMobile + - DOM + - Méthode + - Reference + - Window +translation_of: Web/API/Window/print +--- +<p>{{ ApiRef() }}</p> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>Ouvre la fenêtre de dialogue d'impression pour imprimer le document courant. </p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="eval">window.print() +</pre> + +<h2 id="Specification" name="Specification">Notes</h2> + +<p>Disponible à partir de Chrome {{CompatChrome(45.0)}}, cette méthode est bloquée à l'intérieur d'une balise {{htmlelement("iframe")}} sauf si son attribut sandbox a la valeur allow-modal.</p> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('HTML5 Web application', '#dom-print', 'print()')}}</td> + <td>{{Spec2('HTML5 Web application')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en/Printing" title="en/Printing">Printing</a></li> + <li>{{ domxref("window.onbeforeprint") }}</li> + <li>{{ domxref("window.onafterprint") }}</li> +</ul> + +<p>{{ languages( { "ja": "ja/DOM/window.print", "it": "it/DOM/window.print" , "zh-cn": "zh-cn/DOM/window.print" } ) }}</p> diff --git a/files/fr/web/api/window/prompt/index.html b/files/fr/web/api/window/prompt/index.html new file mode 100644 index 0000000000..cb3128f648 --- /dev/null +++ b/files/fr/web/api/window/prompt/index.html @@ -0,0 +1,93 @@ +--- +title: window.prompt +slug: Web/API/Window/prompt +tags: + - API + - DOM + - Méthode + - Reference + - Window +translation_of: Web/API/Window/prompt +--- +<div>{{ApiRef("Window")}}</div> + +<p>La méthode <code>Window.prompt()</code> affiche une boîte de dialogue, éventuellement avec un message, qui invite l'utilisateur à saisir un texte.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><em>résultat</em> = window.prompt(<em>message</em>, <em>défaut</em>); +</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt><code>message</code> {{optional_inline}}</dt> + <dd>Une chaîne de caractères qui sera affichée pour l'utilisateur. Cet argument peut ne pas être utilisé s'il n'y a rien à afficher dans la fenêtre.</dd> + <dt><code>default</code> {{optional_inline}}</dt> + <dd>Une chaîne de caractères contenant la valeur par défaut affichée pour la saisie. Pour Internet Explorer 7 et 8, si cet argument n'est pas fourni, ce sera la chaîne de caractères <code>"undefined"</code> qui sera la valeur par défaut.</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>La chaîne de caractères qui a été saisie par l'utilisateur ou <code>null</code>.</p> + +<h2 id="Exemples">Exemples</h2> + +<pre class="brush: js notranslate">let signe = prompt("Quel est votre signe astrologique ?"); + +if (signe.toLowerCase() == "verseau") { + console.log("Oh ? moi aussi je suis verseau :)"); +} + +// Différentes façons d'utiliser prompt +signe = window.prompt(); // ouvre une fenêtre de saisie sans texte +signe = prompt(); // ouvre une fenêtre de saisie sans texte + + // ouvre une fenêtre avec le texte "Quelle est la réponse ?" +signe = window.prompt('Quelle est la réponse ?'); + +// ouvre une fenêtre avec le texte "Quelle est la réponse ?" +// avec la valeur "42" comme réponse par défaut +signe = window.prompt('Quelle est la réponse ?', '42');</pre> + +<p>Lorsque l'utilisateur clique sur le bouton OK, le texte saisi dans le champ est renvoyé par la fonction. Si l'utilisateur clique sur OK sans avoir saisi de texte, c'est la chaîne vide qui est renvoyée. Si l'utilisateur clique sur le bouton "Annuler", la fonction renvoie <code>null</code>.</p> + +<h2 id="Notes">Notes</h2> + +<p>Une boîte de dialogue contient un texte sur une ligne, un bouton "Annuler" ainsi qu'un bouton "OK". Elle permet de renvoyer le texte (éventuellement vide) saisi par l'utilisateur dans le champ de saisie.</p> + +<p><span class="comment">The following text is shared between this article, DOM:window.confirm and DOM:window.alert</span>Les boîtes de dialogue sont des fenêtres modales : elles empêchent l'utilisateur d'accéder au reste de l'interface du programme tant que la fenêtre n'est pas fermée. Pour ces raisons, mieux vaut ne pas abuser des fonctions qui créent de telles boîtes de dialogue et autres fenêtres modales.</p> + +<p>On notera que le résultat de la fonction est une chaîne de caractères. Cela signifie qu'il faut parfois convertir la valeur founie par l'utilisateur. Si, par exemple, on souhaite que la réponse soit un nombre, il faudra la convertir (avec le constructeur {{jsxref("Number")}} éventuellement).</p> + +<pre class="brush: js notranslate">const aNumber = Number(window.prompt("Veuillez saisir un nombre.", ""));</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'timers-and-user-prompts.html#dom-prompt', 'prompt()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div> + +<p>{{Compat("api.Window.prompt")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("window.alert", "alert")}}</li> + <li>{{domxref("window.confirm", "confirm")}}</li> +</ul> diff --git a/files/fr/web/api/window/rejectionhandled_event/index.html b/files/fr/web/api/window/rejectionhandled_event/index.html new file mode 100644 index 0000000000..ad18e72fc0 --- /dev/null +++ b/files/fr/web/api/window/rejectionhandled_event/index.html @@ -0,0 +1,82 @@ +--- +title: 'Window: rejectionhandled event' +slug: Web/API/Window/rejectionhandled_event +tags: + - API + - Evènement + - HTML DOM + - JavaScript + - Promesse + - Reference + - Window + - onrejectionhandled + - rejectionhandled +translation_of: Web/API/Window/rejectionhandled_event +--- +<div>{{APIRef("HTML DOM")}}</div> + +<p><span class="seoSummary">L'événement <strong><code>rejectionhandled</code></strong> est envoyé à la portée globale du script (généralement {{domxref("window")}} mais aussi {{domxref("Worker")}}) chaque fois qu'un JavaScript {{jsxref("Promise")}} est rejeté mais après que le rejet de la promesse a été traité.</span> Cela peut être utilisé dans le débogage et pour la résilience générale des applications, en tandem avec l'événement {{domxref ("Window.unhandledrejection_event", "unhandledrejection")}}, qui est envoyé lorsqu'une promesse est rejetée mais qu'il n'y a pas de responsable du rejet .</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("PromiseRejectionEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td>{{domxref("WindowEventHandlers.onrejectionhandled", "onrejectionhandled")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Exemple">Exemple</h2> + +<p>Vous pouvez utiliser l'événement <code>rejectionhandled</code> pour consigner les promesses rejetées sur la console, ainsi que les raisons pour lesquelles elles ont été rejetées :</p> + +<pre class="brush: js notranslate">window.addEventListener("rejectionhandled", event => { + console.log("Promise rejected; reason: " + event.reason); +}, false); +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'webappapis.html#unhandled-promise-rejections', 'rejectionhandled')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.rejectionhandled_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{SectionOnPage("/en-US/docs/Web/JavaScript/Guide/Using_promises", "Promise rejection events")}}</li> + <li>{{domxref("PromiseRejectionEvent")}}</li> + <li>{{jsxref("Promise")}}</li> + <li>{{domxref("Window/unhandledrejection_event", "unhandledrejection")}}</li> +</ul> diff --git a/files/fr/web/api/window/requestanimationframe/index.html b/files/fr/web/api/window/requestanimationframe/index.html new file mode 100644 index 0000000000..8bdb9c1f89 --- /dev/null +++ b/files/fr/web/api/window/requestanimationframe/index.html @@ -0,0 +1,91 @@ +--- +title: Window.requestAnimationFrame() +slug: Web/API/Window/requestAnimationFrame +tags: + - API + - DOM + - JavaScript +translation_of: Web/API/window/requestAnimationFrame +--- +<p>{{APIRef("Window")}}</p> + +<p>La méthode <strong><code>window.requestAnimationFrame()</code></strong> notifie le navigateur que vous souhaitez exécuter une animation et demande que celui-ci exécute une fonction spécifique de mise à jour de l'animation, avant le prochain rafraîchissement du navigateur. Cette méthode prend comme argument un callback qui sera appelé avant le rafraîchissement du navigateur.</p> + +<div class="note"><strong>Note:</strong> Si vous souhaitez animer une nouvelle frame durant le prochain repaint, votre callback doit appeler la méthode <code>requestAnimationFrame()</code>.</div> + +<p>Vous devez appeler cette méthode dès que vous êtes prêt à rafraîchir votre animation. La fonction contenant l'animation doit être appelée avant que le navigateur n'effectue un nouveau rafraîchissement . En moyenne, le callback sera appelé 60 fois par seconde, cela dépendra de la fréquence de rafraîchissement de votre écran, conformément aux recommandations de la W3C. Cette fréquence peut être inférieure si plusieurs onglets sont ouverts simultanément.</p> + +<p>Le callback possède un seul argument, un {{domxref("DOMHighResTimeStamp")}}, qui est le temps, en millisecondes avec une précision minimum de 10 µs, durant lequel l'exécution du rafraîchissement est prévu.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="brush: js"><em>requestID</em> = window.requestAnimationFrame(<em>callback</em>); // Firefox 23 / IE 10 / Chrome / Safari 7 (incl. iOS) +<em>requestID</em> = window.mozRequestAnimationFrame(<em>callback</em>); // Firefox < 23 +<em>requestID</em> = window.webkitRequestAnimationFrame(callback); // Anciennes versions de Safari / Chrome +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<dl> + <dt><code>callback</code></dt> + <dd>Un paramètre définissant la fonction à appeler lorsque votre animation va être rafraîchie lors du prochain rafraîchissement. Le callback ne prend qu'un seul argument, un {{domxref("DOMHighResTimeStamp")}}, qui est le temps à partir duquel requestAnimationFrame va commencer à appeler les callbacks.</dd> +</dl> + +<h3 id="Valeur_retournée">Valeur retournée</h3> + +<p><code>requestID</code> est un entier <code>long</code> unique identifiant l'élément dans la liste des callbacks. C'est une valeur différente de zéro, mais il est prudent de ne pas faire de suppositions sur cette valeur. En passant cette valeur en paramètre de la méthode {{domxref("window.cancelAnimationFrame()")}}, vous annulez l'appel du callback.</p> + +<h2 id="Notes" name="Notes">Exemple</h2> + +<pre class="brush: js">window.requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || + window.webkitRequestAnimationFrame || window.msRequestAnimationFrame; + + +var start = null; + +var d = document.getElementById("SomeElementYouWantToAnimate"); + +function step(timestamp) { + var progress; + if (start === null) start = timestamp; + progress = timestamp - start; + d.style.left = Math.min(progress/10, 200) + "px"; + if (progress < 2000) { + requestAnimationFrame(step); + } +} + +requestAnimationFrame(step); +</pre> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilités</h2> + +<div> +<p>{{Compat("api.Window.requestAnimationFrame")}}</p> +</div> + +<h3 id="Specification" name="Specification">Notes pour Gecko</h3> + +<p>[1] Avant Gecko 11.0 {{geckoRelease("11.0")}}, <code>mozRequestAnimationFrame()</code> pouvait être appelée sans paramètres d'entrée. Cela n'est plus supporté et n'est pas <span class="short_text" id="result_box" lang="fr"><span class="hps">susceptible</span></span> d'être standardisé.</p> + +<p>[2] Le callback prend comme paramètre un {{domxref("DOMTimeStamp")}} au lieu d'un {{domxref("DOMHighResTimeStamp")}} si c'est la version préfixée qui est utilisée. <code>DOMTimeStamp</code> n'a qu'une précision de l'ordre de la milliseconde, mais <code>DOMHightResTimeStamp</code> a une précision minimale de l'ordre de 10 microsecondes.</p> + +<h3 id="Notes_pour_Chrome">Notes pour Chrome</h3> + +<p>La syntaxe correcte, dans Chrome, pour annuler l'exécution est<code> window.cancelAnimationFrame()</code>. Dans les anciennes versions, <code>window.webkitCancelAnimationFrame()</code> & <code>window.webkitCancelRequestAnimationFrame() sont obsolètes</code> mais sont toujours supportées pour le moment.</p> + +<h2 id="Specification" name="Specification">Specification</h2> + +<p>{{spec("http://www.w3.org/TR/animation-timing/#requestAnimationFrame", "Timing control for script-based animations: requestAnimationFrame", "WD")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("window.mozAnimationStartTime")}}</li> + <li>{{domxref("window.cancelAnimationFrame()")}}</li> + <li><a href="http://weblogs.mozillazine.org/roc/archives/2010/08/mozrequestanima.html">mozRequestAnimationFrame</a> - Blog post</li> + <li><a href="http://paulirish.com/2011/requestanimationframe-for-smart-animating/">requestAnimationFrame for smart animating</a> - Blog post</li> + <li><a href="http://hacks.mozilla.org/2011/08/animating-with-javascript-from-setinterval-to-requestanimationframe/">Animating with javascript: from setInterval to requestAnimationFrame</a> - Blog post</li> + <li><a href="http://blogs.msdn.com/b/ie/archive/2011/07/05/using-pc-hardware-more-efficiently-in-html5-new-web-performance-apis-part-1.aspx">Using PC Hardware more efficiently in HTML5: New Web Performance APIs, Part 1</a> - Blog post</li> + <li><a href="http://www.testufo.com/#test=animation-time-graph" title="http://www.testufo.com/#test=animation-time-graph">TestUFO: Test your web browser for requestAnimationFrame() Timing Deviations</a></li> +</ul> diff --git a/files/fr/web/api/window/requestidlecallback/index.html b/files/fr/web/api/window/requestidlecallback/index.html new file mode 100644 index 0000000000..f78ca5dfae --- /dev/null +++ b/files/fr/web/api/window/requestidlecallback/index.html @@ -0,0 +1,111 @@ +--- +title: window.requestIdleCallback() +slug: Web/API/Window/requestIdleCallback +translation_of: Web/API/Window/requestIdleCallback +--- +<div>{{APIRef}}{{SeeCompatTable}}</div> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>La méthode <code><strong>window.requestIdleCallback() </strong></code>mémorise une fonction qui sera appellée lorsque le navigateur n'aura plus aucune autre tâche en cours. Cela offre au développeur la possibilité de réaliser des tâches à basse priorité en arrière-plan sur le thread principal, sans impacter l'expérience utilisateur (ralentissement des animations, etc). L'ordre des appels aux fonctions est généralement premier entré, premier sorti, sauf si le timeout défini au moment de l'enregistrement est atteint avant que le navigateur n'ait eu le temps d'appeler la fonction en question.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><code>var idleCallbackId = window.requestIdleCallback(fonction[, options])</code></pre> + +<h3 id="Returns" name="Returns">Retour de l'appel</h3> + +<p>Un entier long non-signé qui peut être utilisé pour annulé l'appel à la fonction via la méthode {{domxref("window.cancelIdleCallback()")}}.</p> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<dl> + <dt><font face="Consolas, Liberation Mono, Courier, monospace">fonction</font></dt> + <dd>La référence d'une fonction qui devrait être appellée dans un futur proche. La fonction en question recevra en argument un objet de type temps restant avec les propriétés suivantes : + <ul> + <li><code>timeRemaining </code>: Fonction qui retourne un {{domxref("DOMHighResTimeStamp")}} repésentant le temps restant estimé par le navigateur pour exécuter la tâche, ayant pour valeur minimale zéro. Les tâches nécessitant un temps d'exécution relativement long sont susceptibles de recourir à plusieurs appels à cette méthode s'il reste du travail à effectuer, rendant la main au navigateur peu avant que le compteur n'atteigne zéro. <code>timeRemaining()</code> retournera toujours zéro si <code>didTimeout</code> est positionné à true (i.e. la fonction n'a pas été appelée durant la période de repos du navigateur). La limite de temps est limitée à 50ms, même si le navigateur reste n'a pas d'autre tâche à exécuter pendant une durée plus longue.</li> + <li><code>didTimeout </code>: Un booléen positionné à true si la fonction est appelée car le timeout a été atteint, et false si elle a été appelée par le navigateur durant une période de repos.</li> + </ul> + </dd> + <dt><code>options</code> {{optional_inline}}</dt> + <dd>Objet contenant des paramètres de configuration optionnels. Les propriétés sont les suivantes : + <ul> + <li><code>timeout </code>: Si <code>timeout</code> est spécifié et possède une valeur positive, la fonction sera appelée au bout de au moins <code>timeout</code> millisecondes si elle n'a pas été appelée par le navigateur au préalable.</li> + </ul> + </dd> +</dl> + +<h2 id="Specifications" name="Specifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th>Spécification</th> + <th>Status</th> + <th>Comment</th> + </tr> + <tr> + <td>{{SpecName('Background Tasks')}}</td> + <td>{{Spec2('Background Tasks')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Compatibilité avec les navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatChrome(47)}}</td> + <td>{{CompatNo}}<sup>[1]</sup></td> + <td>{{CompatNo}}</td> + <td>{{CompatOpera(34)}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Android Webview</th> + <th>Firefox Mobile (Gecko)</th> + <th>Firefox OS</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome(47)}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatChrome(47)}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] En voie d'être déployé dans Firefox 52, voir le {{bug(1198381)}}.</p> diff --git a/files/fr/web/api/window/resizeby/index.html b/files/fr/web/api/window/resizeby/index.html new file mode 100644 index 0000000000..8ad1939c15 --- /dev/null +++ b/files/fr/web/api/window/resizeby/index.html @@ -0,0 +1,75 @@ +--- +title: Window.resizeBy() +slug: Web/API/Window/resizeBy +tags: + - API + - Window +translation_of: Web/API/Window/resizeBy +--- +<div>{{APIRef}}</div> + +<p>La méthode <code><strong>Window.resizeBy()</strong></code> redimensionne la fenêtre actuelle d'une taille spécifié.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">window.resizeBy(<em>xDelta, yDelta</em>) +</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<ul> + <li><code>xDelta</code> est le nombre de pixels pour agrandir la fenêtre horizontalement.</li> + <li><code>yDelta</code> est le nombre de pixels pour agrandir la fenêtre verticalement.</li> +</ul> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush:js notranslate">// Réduit la fenêtre +window.resizeBy(-200, -200); +</pre> + +<h2 id="Notes">Notes</h2> + +<p>Cette méthode redimensionne la fenêtre par rapport à sa taille actuelle. Pour redimensionner la fenêtre en termes absolus, utilisez {{domxref ("window.resizeTo ()")}}.</p> + +<h3 id="Créer_et_redimensionner_une_fenêtre_externe">Créer et redimensionner une fenêtre externe</h3> + +<p>Pour des raisons de sécurité, il n'est plus possible dans Firefox pour un site Web de modifier la taille par défaut d'une fenêtre dans un navigateur si la fenêtre n'a pas été créée par window.open () ou contient plusieurs onglets. Consultez le tableau de compatibilité pour plus de détails sur le changement.</p> + +<p>Même si vous créez une fenêtre avec <code>window.open()</code> <strong>elle n'est pas redimensionnable par défaut.</strong> Pour rendre la fenêtre redimensionnable, vous devez l'ouvrir avec le paramètre <code>"resizable"</code> .</p> + +<pre class="brush: js notranslate">// Créer une fenêtre redimensionnable +myExternalWindow = window.open("http://myurl.domain", "myWindowName", "resizable"); + +// Redimensionner la fenêtre à 500 x 500 +myExternalWindow.resizeTo(500, 500); + +// Rendre la fenêtre relativement plus petit à 400 x 400 +myExternalWindow.resizeBy(-100, -100);</pre> + +<p>La fenêtre que vous créez doit respecter la politique de même origine. Si la fenêtre que vous ouvrez n'est pas dans la même origine que la fenêtre actuelle, vous ne pourrez pas redimensionner ni accéder aux informations sur cette fenêtre / cet onglet.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('CSSOM View', '#dom-window-resizeby', 'window.resizeBy()') }}</td> + <td>{{ Spec2('CSSOM View') }}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter https://github.com/mdn/browser-compat-data et nous envoyer une pull request.</div> + +<p>{{Compat("api.Window.resizeBy")}}</p> diff --git a/files/fr/web/api/window/screen/index.html b/files/fr/web/api/window/screen/index.html new file mode 100644 index 0000000000..ff16ac6bc9 --- /dev/null +++ b/files/fr/web/api/window/screen/index.html @@ -0,0 +1,55 @@ +--- +title: Window.screen +slug: Web/API/Window/screen +tags: + - API + - CSSOM View + - DOM + - Fenêtre + - Propriété + - Vue CSSOM + - Écran +translation_of: Web/API/Window/screen +--- +<div>{{APIRef("CSSOM View")}}</div> + +<div>Retourne une référence à l'objet <code style="font-style: normal; line-height: 1.5;">screen</code> associé à la fenêtre. L'object <code style="font-style: normal; line-height: 1.5;">screen</code>, qui implémente l'interface <span style="line-height: 1.5;">{{domxref("Screen")}}, est un objet spécial servant à examiner les propriétés de l'écran qui affiche la fenêtre courante.</span></div> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><var>objetEcran</var> = <var>window</var>.screen; +</pre> + +<h2 id="Example" name="Example">Examples</h2> + +<pre class="brush:js">if (screen.pixelDepth < 8) { + // utiliser la page en colorisation réduite +} else { + // utiliser la page en coolorisation normale +} +</pre> + +<h2 id="Specification" name="Specification">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('CSSOM View', '#dom-window-screen', 'window.screen')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + + + +<p>{{Compat("api.Window.screen")}}</p> diff --git a/files/fr/web/api/window/screenx/index.html b/files/fr/web/api/window/screenx/index.html new file mode 100644 index 0000000000..3a6e7737cb --- /dev/null +++ b/files/fr/web/api/window/screenx/index.html @@ -0,0 +1,101 @@ +--- +title: Window.screenX +slug: Web/API/Window/screenX +tags: + - API + - Propriété + - Window + - lecture seule +translation_of: Web/API/Window/screenX +--- +<div>{{APIRef}}</div> + +<p>La propriété <code><strong>Window.screenX</strong></code> retourne la distance honrizontale, in CSS pixels, of the left border of the user's browser from the left side of the screen.</p> + +<h2 id="Syntax" name="Syntax">Syntax</h2> + +<pre class="syntaxbox"><em>lLoc</em> = window.screenX +</pre> + +<ul> + <li><em><code>lLoc</code></em> is the number of CSS pixels from the left side the screen.</li> +</ul> + +<h2 id="Specifications" name="Specifications">Specifications</h2> + +<table class="standard-table" style="height: 49px; width: 1000px;"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('CSSOM View', '#dom-window-screenx', 'Window.screenX') }}</td> + <td>{{ Spec2('CSSOM View') }}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_avec_les_navigateurs">Compatibilité avec les navigateurs</h2> + +<p>{{ CompatibilityTable() }}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalitée</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Support basic</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }} [1]</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Fonctionnalitée</th> + <th>Android</th> + <th>Chrome pour Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Support basic</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }} [1]</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + <td>{{ CompatVersionUnknown() }}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Avant Firefox 28, Gecko utilisait les dimensions de l'appareil au lieu des pixels CSS ; dans d'autres mots, it was assuming a value of <code>screenPixelsPerCSSPixel</code> of 1 for any device.</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("Window.screenY")}}</li> +</ul> diff --git a/files/fr/web/api/window/scroll/index.html b/files/fr/web/api/window/scroll/index.html new file mode 100644 index 0000000000..82075c6ba2 --- /dev/null +++ b/files/fr/web/api/window/scroll/index.html @@ -0,0 +1,27 @@ +--- +title: window.scroll +slug: Web/API/Window/scroll +translation_of: Web/API/Window/scroll +--- +<p>{{ ApiRef() }}</p> +<h3 id="Summary" name="Summary">Résumé</h3> +<p>Fait glisser la fenêtre vers une position particulière du document</p> +<h3 id="Syntax" name="Syntax">Syntax</h3> +<pre class="eval">window.scroll(<i>x-coord</i>,<i>y-coord</i>) +</pre> +<h3 id="Parameters" name="Parameters">Parameters</h3> +<ul> + <li><code>x-coord</code> est la position horizontale du pixel que vous voulez voir apparaitre en haut à gauche de l’écran.</li> + <li><code>y-coord</code> est la position verticale du pixel que vous voulez voir apparaitre en haut à gauche de l’écran.</li> +</ul> +<h3 id="Example" name="Example">Example</h3> +<pre> // Déplace la fenêtre 100px plus bas + <button onClick="scroll(0, 100);">click to scroll down 100 pixels</button> +</pre> +<h3 id="Notes" name="Notes">Notes</h3> +<p><a href="en/Window.scrollTo">window.scrollTo</a> a un effet identique à cette méthode. Pour se déplacer par pas dans la page, utilisez <a href="en/Window.scrollBy">window.scrollBy</a>. Jetez aussi un œil à <a href="en/Window.scrollByLines">window.scrollByLines</a> et <a href="en/Window.scrollByPages">window.scrollByPages</a>.</p> +<h3 id="Specification" name="Specification">Specification</h3> +<p>DOM Level 0. Hors spécification.</p> +<div class="noinclude"> + </div> +<p>{{ languages( { "ja": "ja/DOM/window.scroll", "pl": "pl/DOM/window.scroll" } ) }}</p> diff --git a/files/fr/web/api/window/scrollbars/index.html b/files/fr/web/api/window/scrollbars/index.html new file mode 100644 index 0000000000..8d563a54bc --- /dev/null +++ b/files/fr/web/api/window/scrollbars/index.html @@ -0,0 +1,75 @@ +--- +title: Window.scrollbars +slug: Web/API/Window/scrollbars +tags: + - API + - HTML DOM + - Propriété + - Reference + - Window +translation_of: Web/API/Window/scrollbars +--- +<div>{{APIRef()}}</div> + +<p>La propriété <code><strong>Window.scrollbars</strong></code> renvoie l'objet <code>scrollbars</code>, dont la visibilité peut être vérifié.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate"><em>objRef</em> = window.scrollbars +</pre> + +<h2 id="Exemple">Exemple</h2> + +<p>L'exemple HTML complet suivant montre comment la propriété <code>visible</code> de l'objet scrollbars est utilisée.</p> + +<pre class="brush: html notranslate"><!doctype html> +<html> +<head> + <title>Divers Tests DOM</title> + <script> + let visibleScrollbars = window.scrollbars.visible; + </script> +</head> +<body> + <p>Divers Tests DOM</p> +</body> +</html> +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'browsers.html#dom-window-scrollbars', 'Window.scrollbars')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#dom-window-scrollbars', 'Window.scrollbars')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.scrollbars")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li>{{domxref("window.locationbar")}}</li> + <li>{{domxref("window.menubar")}}</li> + <li>{{domxref("window.personalbar")}}</li> + <li>{{domxref("window.statusbar")}}</li> + <li>{{domxref("window.toolbar")}}</li> +</ul> diff --git a/files/fr/web/api/window/scrollby/index.html b/files/fr/web/api/window/scrollby/index.html new file mode 100644 index 0000000000..17b80d2ea6 --- /dev/null +++ b/files/fr/web/api/window/scrollby/index.html @@ -0,0 +1,58 @@ +--- +title: Window.scrollBy() +slug: Web/API/Window/scrollBy +tags: + - API + - CSSOM View + - Méthode + - Référence(2) +translation_of: Web/API/Window/scrollBy +--- +<p>{{ APIRef() }}</p> + +<h2 id="Summary" name="Summary">Description</h2> + +<p>Fait défiler le document dans la fenêtre du nombre de pixels passé en paramètre.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="eval">window.scrollBy(<em>X</em>, <em>Y</em>); +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<ul> + <li><code>X</code> est le nombre en pixels pour le défilement horizontal.</li> + <li><code>Y</code> est le nombre en pixels pour le défilement vertical.</li> +</ul> + +<p>Des coordonnées positives feront défiler à droite et vers le bas de la page. Des coordonnées négatives feront défiler à gauche et vers le haut de la page. </p> + +<h2 id="Example" name="Example">Exemples</h2> + +<pre class="eval">// fait défiler d'une page +window.scrollBy(0, window.innerHeight); +</pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p><a href="/fr/docs/DOM/Window.scrollBy">window.scrollBy</a> fait défiler en fonction d'un nombre précis, alors que <a href="/fr/docs/DOM/Window.scroll">window.scroll</a> fait défiler vers une position absolue dans le document. Voir aussi <a href="/fr/docs/DOM/Window.scrollByLines">window.scrollByLines</a>, <a href="/fr/docs/DOM/Window.scrollByPages">window.scrollByPages</a></p> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('CSSOM View', '#dom-window-scrollby', 'window.scrollBy()') }}</td> + <td>{{ Spec2('CSSOM View') }}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> diff --git a/files/fr/web/api/window/scrollbylines/index.html b/files/fr/web/api/window/scrollbylines/index.html new file mode 100644 index 0000000000..471bae984f --- /dev/null +++ b/files/fr/web/api/window/scrollbylines/index.html @@ -0,0 +1,53 @@ +--- +title: Window.scrollByLines() +slug: Web/API/Window/scrollByLines +tags: + - API + - DOM + - DOM_0 + - Méthode + - Non-standard + - Window +translation_of: Web/API/Window/scrollByLines +--- +<div>{{ ApiRef() }}</div> + +<div> +<p id="comment_text_2">{{Non-standard_header}}</p> +</div> + +<h2 id="Summary" name="Summary">Description</h2> + +<p>Fait défiler le document du nombre de lignes spécifié.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox">window.scrollByLines(<var>lignes</var>) +</pre> + +<h2 id="Parameters" name="Parameters">Paramètres</h2> + +<ul> + <li><code>lignes</code> est le nombre de lignes à faire défiler.</li> + <li><code>lignes</code> peut être un entier positif ou négatif.</li> +</ul> + +<h2 id="Example" name="Example">Exemples</h2> + +<pre class="brush:html"><!-- Faire défiler le document de 5 lignes vers le bas. --> +<button onclick="scrollByLines(5);">5 lignes vers le bas</button> +</pre> + +<pre class="brush:html"><!-- Faire défiler le document de 5 lignes vers le haut. --> +<button onclick="scrollByLines(-5);">5 lignes vers le haut</button> +</pre> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<p id="comment_text_2">Ne fait partie d'aucune spécification.</p> + +<h2 id="See_also" name="See_also">See also</h2> + +<ul> + <li>{{domxref("window.scrollBy")}}, {{domxref("window.scrollByPages")}}</li> +</ul> diff --git a/files/fr/web/api/window/scrollbypages/index.html b/files/fr/web/api/window/scrollbypages/index.html new file mode 100644 index 0000000000..e352ef57e0 --- /dev/null +++ b/files/fr/web/api/window/scrollbypages/index.html @@ -0,0 +1,46 @@ +--- +title: Window.scrollByPages() +slug: Web/API/Window/scrollByPages +tags: + - API + - DOM + - Gecko + - Méthode +translation_of: Web/API/Window/scrollByPages +--- +<p>{{ ApiRef() }}{{Non-standard_header}}</p> + +<h3 id="Summary" name="Summary">Description</h3> + +<p>Fait défiler le document du nombre de pages spécifié.</p> + +<h3 id="Syntax" name="Syntax">Syntaxe</h3> + +<pre class="eval">window.scrollByPages(<em>pages</em>) +</pre> + +<h3 id="Parameters" name="Parameters">Paramètres</h3> + +<ul> + <li><code>pages</code> est le nombre de pages à faire défiler.</li> + <li><code>pages</code> peut être un entier positif ou négatif.</li> +</ul> + +<h3 id="Example" name="Example">Exemples</h3> + +<pre>// fait défiler le document d'une page vers le bas +window.scrollByPages(1); + +// fait défiler le document d'une page vers le haut +window.scrollByPages(-1); +</pre> + +<h3 id="Notes" name="Notes">Notes</h3> + +<p>Voir aussi <a href="/fr/docs/Web/API/Window/scrollByPages" title="en/DOM/window.scrollBy">window.scrollBy</a>, <a href="/fr/docs/Web/API/Window/scrollByPages" title="en/DOM/window.scrollByLines">window.scrollByLines</a>, <a href="/fr/docs/Web/API/Window/scroll" title="en/DOM/window.scroll">window.scroll</a>, <a href="fr/docs/Web/API/Window/scrollTo" title="en/DOM/window.scrollTo">window.scrollTo</a>.</p> + +<h3 id="Specification" name="Specification">Spécification</h3> + +<p>DOM Niveau 0. Ne fait pas partie de la spécification.</p> + +<p>{{ languages( { "ja": "ja/DOM/window.scrollByPages", "pl": "pl/DOM/window.scrollByPages", "zh-cn": "zh-cn/DOM/window.scrollByPages" } ) }}</p> diff --git a/files/fr/web/api/window/scrollto/index.html b/files/fr/web/api/window/scrollto/index.html new file mode 100644 index 0000000000..8198308355 --- /dev/null +++ b/files/fr/web/api/window/scrollto/index.html @@ -0,0 +1,42 @@ +--- +title: window.scrollTo +slug: Web/API/Window/scrollTo +tags: + - DOM + - DOM_0 +translation_of: Web/API/Window/scrollTo +--- +<p>{{ ApiRef() }}</p> + +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> + +<p>Fait défiler le document jusqu'à un jeu de coordonnées particulier.</p> + +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> + +<pre class="eval">window.scrollTo(<em>coord-x</em>,<em>coord-y</em>); +</pre> + +<h3 id="Param.C3.A8tres" name="Param.C3.A8tres">Paramètres</h3> + +<ul> + <li><code>coord-x</code> est le pixel le long de l'axe horizontal du document qui doit être affiché en haut à gauche.</li> + <li><code>coord-y</code> est le pixel le long de l'axe vertical du document qui doit être affiché en haut à gauche.</li> +</ul> + +<h3 id="Exemple" name="Exemple">Exemple</h3> + +<pre>window.scrollTo(0, 1000); +</pre> + +<h3 id="Notes" name="Notes">Notes</h3> + +<p>Cette fonction est fonctionnellement identique à <a href="scroll">window.scroll</a>. Pour un défilement relatif, consultez <a href="scrollBy">window.scrollBy</a>, <a href="scrollByLines">window.scrollByLines</a> et <a href="scrollByPages">window.scrollByPages</a>.</p> + +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> + +<p>{{ DOM0() }}</p> + +<div class="noinclude"> </div> + +<p>{{ languages( { "en": "en/DOM/window.scrollTo", "ja": "ja/DOM/window.scrollTo", "pl": "pl/DOM/window.scrollTo" } ) }}</p> diff --git a/files/fr/web/api/window/scrolly/index.html b/files/fr/web/api/window/scrolly/index.html new file mode 100644 index 0000000000..fcc4947b16 --- /dev/null +++ b/files/fr/web/api/window/scrolly/index.html @@ -0,0 +1,125 @@ +--- +title: Window.scrollY +slug: Web/API/Window/scrollY +translation_of: Web/API/Window/scrollY +--- +<div>{{APIRef}}</div> + +<h2 id="Summary" name="Summary">Résumé</h2> + +<p>La propriété <code><strong>scrollY</strong></code> de l'objet {{domxref("Window")}} est une propriété en lecture seule. Elle retourne le nombre de pixels la page actuellement défilés verticalement. Dans les navigateurs modernes, cette valeur est précise au sous-pixel près. Ainsi, la valeur retournée n'est pas forcement un entier.</p> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox">var y = window.scrollY;</pre> + +<ul> + <li><code>y</code> est le nombre de pixels verticaux défilés.</li> +</ul> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush:js">// make sure and go down to the second page +if (window.scrollY) { + window.scroll(0, 0); // reset the scroll position to the top left of the document. +} + +window.scrollByPages(1);</pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>Utilisez cette propriété pour être sûre que le document n'as pas été défilé verticalement si vous utilisez les fonctions de défilement tels que {{domxref("window.scrollBy")}}, {{domxref("window.scrollByLines")}}, ou {{domxref("window.scrollByPages")}}.</p> + +<p>La propriété <code>pageYOffset</code> est un alias de la propriété <code>scrollY</code>:</p> + +<pre>window.pageYOffset == window.scrollY; // toujours vrai</pre> + +<p>Pour une compatibilité multi-navigateur, utilisez <code>window.pageYOffset</code> à la place de <code>window.scrollY</code>. <strong>En outre</strong>, les anciennes versions d'Internet Explorer (< 9) ne supportent pas non plus la propriété et doit-être utilisé à l'aide d'autres propriétés qui ne sont pas standards. Un exemple entièrement compatible :</p> + +<pre class="brush:js">var supportPageOffset = window.pageXOffset !== undefined; +var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat"); + +var x = supportPageOffset ? window.pageXOffset : isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft; +var y = supportPageOffset ? window.pageYOffset : isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop; +</pre> + +<h2 id="Specification" name="Specification">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Status</th> + <th scope="col">Commentaire(s)</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{ SpecName('CSSOM View', '#dom-window-scrolly', 'window.scrollY') }}</td> + <td>{{ Spec2('CSSOM View') }}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>Edge</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile" style="line-height: 19.0909080505371px;"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Android Webview</th> + <th>Firefox Mobile (Gecko)</th> + <th>Firefox OS</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<h2 id="See_also" name="See_also">Voir également</h2> + +<ul> + <li>{{domxref("window.scrollX")}}</li> +</ul> diff --git a/files/fr/web/api/window/sessionstorage/index.html b/files/fr/web/api/window/sessionstorage/index.html new file mode 100644 index 0000000000..6d6bed8021 --- /dev/null +++ b/files/fr/web/api/window/sessionstorage/index.html @@ -0,0 +1,93 @@ +--- +title: Window.sessionStorage +slug: Web/API/Window/sessionStorage +tags: + - API +translation_of: Web/API/Window/sessionStorage +--- +<p>{{APIRef}}</p> + +<p>La propriété <code>sessionStorage</code> permet d'utiliser un objet {{domxref("Storage")}} valable pour la session de navigation en cours et pour les pages du même domaine que la page actuelle. L'objet global <code>sessionStorage</code> est similaire à {{domxref("Window.localStorage")}}, à la différence que les données enregistrées dans <code>sessionStorage</code> ont une durée vie limitée et expirent à la fin de la session de navigation actuelle. Une session de navigation dure aussi longtemps que le navigateur est ouvert et s'étend sur plusieurs chargements, rechargements et restaurations de pages. En revanche, une session de navigation n'est valable que pour le contexte de navigation actuel, c'est-à-dire que le fait d'<strong>ouvrir une page dans un nouvel onglet ou dans une nouvelle fenêtre provoquera l'initialisation d'une nouvelle session de navigation</strong>, ce qui diffère du comportement des sessions utilisant des cookies.</p> + +<p>Il est à noter que les données stockées dans sessionStorage ou localStorage sont <strong>spécifiques au protocole de la page.</strong></p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="brush: js notranslate">// Enregistrer des données dans sessionStorage +sessionStorage.setItem('clé', 'valeur'); + +// Récupérer des données depuis sessionStorage +<code>var data = sessionStorage.getItem('clé'); + +// Supprimer des données de sessionStorage +sessionStorage.removeItem('clé'); + +// Supprimer toutes les données de sessionStorage +sessionStorage.clear();</code> +</pre> + +<h3 id="Valeur">Valeur</h3> + +<p>Un objet {{domxref("Storage")}}.</p> + +<h2 id="Exemple">Exemple</h2> + +<p>L'exemple de code suivant accède à l'objet de stockage de session associé au domaine actuel et y ajoute une donnée à l'aide de {{domxref("Storage.setItem()")}}.</p> + +<pre class="brush: js notranslate">sessionStorage.setItem('myCat', 'Tom');</pre> + +<p>L'exemple suivant sauvegarde automatiquement le contenu d'un champ textuel. Si la page est accidentellement rafraîchie, le contenu du champ est restauré de sorte qu'aucune saisie n'est perdue.</p> + +<pre class="brush: js notranslate">// Récupération du champ à enregistrer +var champ = document.getElementById("champ"); + +// Vérification de l'existence d'une donnée enregistrée auparavant +// (ce ne sera le cas que si la page a été rafraîchie) +if (sessionStorage.getItem("autosave")) { + // Restauration du contenu du champ + champ.value = sessionStorage.getItem("autosave"); +} + +// Écoute des changements de valeur du champ +champ.addEventListener("change", function() { + // Enregistrement de la saisie utilisateur dans le stockage de session + sessionStorage.setItem("autosave", champ.value); +});</pre> + +<div class="note"> +<p><strong>Note</strong>: Veuillez vous référer à l'article <a href="/fr/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Utilisation de l'API Web Storage</a> pour des exemples plus complets.</p> +</div> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName("HTML WHATWG", "webstorage.html#dom-sessionstorage", "sessionStorage")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatilibité_des_navigateurs">Compatilibité des navigateurs</h2> + +<div class="hidden"> +<p>The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> +</div> + +<p>{{Compat("api.Window.sessionStorage")}}</p> + +<p>Chaque navigateur attribue des capacités de stockage limitées pour <code>localStorage</code> et <code>sessionStorage</code>. Vous en trouverez certaines dans ce <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/">récapitulatif de tests des capacités de stockage attribuées en fonction du navigateur</a>.</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li><a href="/fr/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Utilisation de l'API Web Storage</a></li> + <li>{{domxref("Window.localStorage")}}</li> +</ul> diff --git a/files/fr/web/api/window/showmodaldialog/index.html b/files/fr/web/api/window/showmodaldialog/index.html new file mode 100644 index 0000000000..20cdd6248a --- /dev/null +++ b/files/fr/web/api/window/showmodaldialog/index.html @@ -0,0 +1,91 @@ +--- +title: window.showModalDialog +slug: Web/API/Window/showModalDialog +tags: + - Obsolete +translation_of: Web/API/Window/showModalDialog +--- +<p>{{ ApiRef() }} {{ Fx_minversion_header(3) }}</p> + +<h3 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h3> + +<p>Crée et affiche un dialogue modal contenant un document HTML spécifié.</p> + +<div class="note"> +<p><strong><em>Cette fonction est obsolète</em></strong>.</p> + +<p>Le support a été arrêté avec la sortie de <a href="http://blog.chromium.org/2014/07/disabling-showmodaldialog.html">Chrome 37</a>. Il y possibilité de la laisser active juqu'en Mai 2015 en configurant les paramètres de politique d'entreprise, plus de détails : <a href="http://www.chromium.org/administrators/policy-list-3#EnableDeprecatedWebPlatformFeatures">ici</a>.</p> + +<p>Mozilla a annoncé que le support de cette méthode sera supprimé ({{bug(981796)}}). Ce changement ne sera pas effectif avant Firefox 39, planifié pour les alentours de mi-juin 2015. Pour les entreprises, il est possible d'utiliser le build ESR 38 qui supportera la méthode jusqu'en milieu d'année 2016.</p> +</div> + +<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> + +<pre class="eval"><em>retour</em> = window.showModalDialog(<em>uri</em>[,<em>arguments</em>][,<em>options</em>]); +</pre> + +<p>où</p> + +<ul> + <li><code>retour</code> est un variant, indiquant la propriété returnValue telle que définie par la fenêtre du document spécifié par <code>uri</code>.</li> + <li><code>uri</code> est l'URI du document à afficher dans la boîte de dialogue.</li> + <li><code>arguments</code> est un variant optionnel contenant les valeurs à passer à la boîte de dialogue ; celles-ci sont disponibles dans la propriété <code><a href="fr/DOM/window.dialogArguments">window.dialogArguments</a></code> de son objet <code><a href="fr/DOM/window">window</a></code>.</li> + <li><code>options</code> est une chaîne optionnelle spécifiant les décorations de la fenêtre de dialogue, avec une ou plusieurs valeurs séparées par des points-virgules :</li> +</ul> + +<table class="standard-table"> + <tbody> + <tr> + <th>Syntaxe</th> + <th>Description</th> + </tr> + <tr> + <td><code>center: <span class="nowiki">{on | off | yes | no | 1 | 0 }</span></code></td> + <td>Si cette valeur est <code>on</code>, <code>yes</code> ou 1, la fenêtre de dialogue est centrée sur le bureau ; autrement elle est cachée. La valeur par défaut est <code>yes</code>.</td> + </tr> + <tr> + <td><code>dialogheight:<em>height</em> </code></td> + <td>Spécifie la hauteur de la boîte de dialogue ; par défaut, la taille est spécifiée en pixels.</td> + </tr> + <tr> + <td><code>dialogleft:<em>left</em> </code></td> + <td>Spécifie la position horizontale de la boîte de dialogue par rapport au coin supérieur gauche du bureau.</td> + </tr> + <tr> + <td><code>dialogwidth:<em>width</em> </code></td> + <td>Spécifie la largeur de la boîte de dialogue ; par défaut, la taille est spécifiée en pixels.</td> + </tr> + <tr> + <td><code>dialogtop:<em>top</em> </code></td> + <td>Spécifie la position verticale de la boîte de dialogue par rapport au coin supérieur gauche du bureau.</td> + </tr> + <tr> + <td><code>resizable: <span class="nowiki">{on | off | yes | no | 1 | 0 }</span></code></td> + <td>Si cette valeur est <code>on</code>, <code>yes</code> ou 1, la fenêtre de dialogue peut être redimensionnée par l'utilisateur ; autrement sa taille est fixe. La valeur par défaut est <code>no</code>.</td> + </tr> + <tr> + <td><code>scroll: <span class="nowiki">{on | off | yes | no | 1 | 0 }</span></code></td> + <td>Si cette valeur est <code>on</code>, <code>yes</code> ou 1, la fenêtre de dialogue a des barres de défilement ; autrement elle n'en a pas. La valeur par défaut est <code>no</code>.</td> + </tr> + </tbody> +</table> + +<p>{{ Note("Firefox n\'implémente pas les paramètres <code>dialogHide</code>, <code>edge</code>, <code>status</code> ou <code>unadorned</code>.") }}</p> + +<h3 id="Compatibilit.C3.A9" name="Compatibilit.C3.A9">Compatibilité</h3> + +<p>Introduit par Microsoft Internet Explorer 4. Support ajouté à Firefox dans Firefox 3.</p> + +<h3 id="Exemples" name="Exemples">Exemples</h3> + +<p><a class="external" href="http://developer.mozilla.org/samples/domref/showModalDialog.html">Essayer <code>showModalDialog()</code></a>.</p> + +<h3 id="Notes" name="Notes">Notes</h3> + +<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> + +<p>Microsoft MSDN : <a class="external" href="http://msdn2.microsoft.com/en-us/library/ms536759.aspx">showModalDialog</a></p> + +<div class="noinclude"> </div> + +<p>{{ languages( { "en": "en/DOM/window.showModalDialog", "ja": "ja/DOM/window.showModalDialog" } ) }}</p> diff --git a/files/fr/web/api/window/stop/index.html b/files/fr/web/api/window/stop/index.html new file mode 100644 index 0000000000..f3652b10da --- /dev/null +++ b/files/fr/web/api/window/stop/index.html @@ -0,0 +1,58 @@ +--- +title: Window.stop() +slug: Web/API/Window/stop +tags: + - API + - DOM + - HTML DOM + - Méthode + - Reference + - Window + - stop +translation_of: Web/API/Window/stop +--- +<div> {{APIRef}}</div> + +<div><span class="seoSummary"><strong><code>window.stop()</code></strong> arrête le chargment des ressources supplémentaires dans le contexte de navigation actuel, ce qui équivaut au bouton d'arrêt dans le navigateur.</span></div> + +<div></div> + +<div>En raison de la manière dont les scripts sont exécutés, cette méthode ne peut pas interrompre le chargement de son document parent, mais elle arrêtera ses images, nouvelles fenêtres et autres objets en cours de chargement.</div> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox notranslate">window.stop() +</pre> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush:js notranslate">window.stop(); +</pre> + +<h2 id="Specification" name="Specification">Spécification</h2> + +<table class="spectable standard-table"> + <tbody> + <tr> + <th scope="col">Spécifications</th> + <th scope="col">Statut</th> + <th scope="col">Commentaires</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG','browsers.html#dom-window-stop','Window.stop()')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#dom-window-stop', 'Window.stop')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.stop")}}</p> diff --git a/files/fr/web/api/window/storage_event/index.html b/files/fr/web/api/window/storage_event/index.html new file mode 100644 index 0000000000..49152ebc7d --- /dev/null +++ b/files/fr/web/api/window/storage_event/index.html @@ -0,0 +1,83 @@ +--- +title: 'Window: storage event' +slug: Web/API/Window/storage_event +tags: + - API + - Evènement + - Reference + - Stockage + - Stockage Web + - Window +translation_of: Web/API/Window/storage_event +--- +<div>{{APIRef}}</div> + +<p>L'événement <strong><code>storage</code></strong> de l'interface {{domxref("Window")}} se déclenche lorsqu'une de stockage (<code>localStorage</code>) a été modifiée dans le contexte d'un autre document.</p> + +<table class="properties"> + <thead> + </thead> + <tbody> + <tr> + <th>Bulles</th> + <td>Non</td> + </tr> + <tr> + <th>Annulable</th> + <td>Non</td> + </tr> + <tr> + <th>Interface</th> + <td>{{domxref("StorageEvent")}}</td> + </tr> + <tr> + <th>Propriété de gestionnaire d'événements</th> + <td>{{domxref("WindowEventHandlers.onstorage", "onstorage")}}</td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<p>Consignez l'élément <code>sampleList</code> sur la console lorsque l'événement <code>storage</code> se déclenche :</p> + +<pre class="brush: js notranslate">window.addEventListener('storage', () => { + // Lorsque le stockage local change, vider la liste sur + // la console. + console.log(JSON.parse(window.localStorage.getItem('sampleList'))); +});</pre> + +<p>La même action peut être réalisée ) l'aide de la propriété du gestionnaire d'événements <code><a href="/en-US/docs/Web/API/WindowEventHandlers/onstorage">onstorage</a></code> :</p> + +<pre class="brush: js notranslate">window.onstorage = () => { + // Lorsque le stockage local change, vider la liste dans + // la console. + console.log(JSON.parse(window.localStorage.getItem('sampleList'))); +}; +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + </tr> + <tr> + <td>{{SpecName('HTML WHATWG', 'indices.html#event-storage', 'storage')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{Compat("api.Window.storage_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/Web_Storage_API">Web Storage API</a></li> + <li><a href="/en-US/docs/Web/API/Web_Storage_API/Using_the_Web_Storage_API">Using the Web Storage API</a></li> +</ul> diff --git a/files/fr/web/api/window/top/index.html b/files/fr/web/api/window/top/index.html new file mode 100644 index 0000000000..6ccc92f659 --- /dev/null +++ b/files/fr/web/api/window/top/index.html @@ -0,0 +1,56 @@ +--- +title: Window.top +slug: Web/API/Window/top +tags: + - API + - HTML DOM + - NeedsExample + - Propriété + - Reference + - Window +translation_of: Web/API/Window/top +--- +<div>{{APIRef}}</div> + +<p>Renvoie une référence à la fenêtre la plus haute dans la hiérarchie des fenêtres</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox notranslate">var <var>topWindow</var> = window.top; +</pre> + +<h2 id="Notes">Notes</h2> + +<p>Là où la propriété {{domxref("window.parent")}} renvoie le parent immédiat de la fenêtre courante, <code>window.top</code> renvoie la fenêtre la plus haute dans la hiérarchie des objets de fenêtre.</p> + +<p>Cette propriété est particulièrement utile lorsque vous avez affaire à une fenêtre qui se trouve dans une subframe d'un ou de plusieurs parents, et que vous souhaitez accéder au jeu de frameset de niveau supérieur.</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'browsers.html#dom-top', 'window.top')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'browsers.html#dom-top', 'window.top')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Spécification initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.top")}}</p> diff --git a/files/fr/web/api/window/url/index.html b/files/fr/web/api/window/url/index.html new file mode 100644 index 0000000000..fa84a12f6d --- /dev/null +++ b/files/fr/web/api/window/url/index.html @@ -0,0 +1,94 @@ +--- +title: Window.URL +slug: Web/API/Window/URL +translation_of: Web/API/URL +--- +<p>{{ApiRef("Window")}}{{SeeCompatTable}}</p> + +<p>La propriété <strong><code>Window.URL</code></strong> retourne un objet qui fournit les méthodes statiques utilisées pour créer et gérer les objets URLs. On peut aussi l'appeler comme uns constructeur pour instancier des objets {{domxref("URL")}}.</p> + +<p>{{AvailableInWorkers}}</p> + +<h2 id="Syntax">Syntax</h2> + +<p>Utilisation de la méthode statique:</p> + +<pre class="syntaxbox"><code><var>img</var>.src = URL.{{domxref("URL.createObjectURL", "createObjectURL")}}(<var>blob</var>);</code></pre> + +<p>Utilisation d'un objet instancié:</p> + +<pre class="syntaxbox"><code>var <var>url</var> = new {{domxref("URL.URL", "URL")}}("../cats/", "https://www.example.com/dogs/");</code></pre> + +<h2 id="Specification">Specification</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName('URL', '#dom-url', 'URL')}}</td> + <td>{{Spec2('URL')}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<p>{{CompatibilityTable}}</p> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari</th> + </tr> + <tr> + <td>Basic support</td> + <td>8.0<sup>[2]</sup></td> + <td>{{CompatGeckoDesktop("2.0")}}<sup>[1]</sup><br> + {{CompatGeckoDesktop("19.0")}}</td> + <td>10.0</td> + <td>15.0<sup>[2]</sup></td> + <td>6.0<sup>[2]</sup><br> + 7.0</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Mobile</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + </tr> + <tr> + <td>Basic support</td> + <td>{{CompatVersionUnknown}}<sup>[2]</sup></td> + <td>{{CompatGeckoMobile("14.0")}}<sup>[1]</sup><br> + {{CompatGeckoMobile("19.0")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>15.0<sup>[2]</sup></td> + <td>6.0<sup>[2]</sup></td> + </tr> + </tbody> +</table> +</div> + +<p>[1] From Gecko 2 (Firefox 4) to Gecko 18 included, Gecko returned an object with the non-standard <code>nsIDOMMozURLProperty</code> internal type. In practice, this didn't make any difference.</p> + +<p>[2] Implemented under the non-standard name <code>webkitURL</code>.</p> diff --git a/files/fr/web/api/window/vrdisplayconnect_event/index.html b/files/fr/web/api/window/vrdisplayconnect_event/index.html new file mode 100644 index 0000000000..dab575facf --- /dev/null +++ b/files/fr/web/api/window/vrdisplayconnect_event/index.html @@ -0,0 +1,83 @@ +--- +title: 'Window: vrdisplayconnect event' +slug: Web/API/Window/vrdisplayconnect_event +tags: + - Evènement + - Reference + - WebVR + - onvrdisplayconnect + - vrdisplayconnect +translation_of: Web/API/Window/vrdisplayconnect_event +--- +<div>{{APIRef("Window")}}</div> + +<div> +<p>L'événement <strong><code>vrdisplayconnect</code></strong> de l'<a href="/en-US/docs/Web/API/WebVR_API">API WebVR</a> est déclenché lorsqu'un écran VR compatible est connecté à l'ordinateur.</p> +</div> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("VRDisplayEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td><code><a href="/en-US/docs/Web/API/Window/onvrdisplayconnect">onvrdisplayconnect</a></code></td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<p>Vous pouvez utiliser l'événement <code>vrdisplayconnect</code> dans une méthode <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener</a></code> :</p> + +<pre class="brush: js notranslate">window.addEventListener('vrdisplayconnect', function() { + info.textContent = 'Affichage connecté.'; + reportDisplays(); +});</pre> + +<p>Ou utilisez la propriété du gestionnaire d'événements <code><a href="/en-US/docs/Web/API/Window/onvrdisplayconnect">onvrdisplayconnect</a></code> :</p> + +<pre class="brush: js notranslate">window.onvrdisplayconnect = function() { + info.textContent = 'Affichage connecté.'; + reportDisplays(); +};</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentair</th> + </tr> + <tr> + <td>{{SpecName('WebVR 1.1', '#dom-window-onvrdisplayconnect', 'vrdisplayconnect')}}</td> + <td>{{Spec2('WebVR 1.1')}}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.vrdisplayconnect_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/WebVR_API">WebVR API homepage</a></li> + <li><a href="http://mozvr.com/">MozVr.com</a> — démos, téléchargements et autres ressources de l'équipe Mozilla VR.</li> +</ul> diff --git a/files/fr/web/api/window/vrdisplaydisconnect_event/index.html b/files/fr/web/api/window/vrdisplaydisconnect_event/index.html new file mode 100644 index 0000000000..74b66bc520 --- /dev/null +++ b/files/fr/web/api/window/vrdisplaydisconnect_event/index.html @@ -0,0 +1,83 @@ +--- +title: 'Window: vrdisplaydisconnect event' +slug: Web/API/Window/vrdisplaydisconnect_event +tags: + - Evènement + - Reference + - WebVR + - onvrdisplaydisconnect + - vrdisplaydisconnect +translation_of: Web/API/Window/vrdisplaydisconnect_event +--- +<div>{{APIRef("Window")}}</div> + +<div> +<p>L'événement <strong><code>vrdisplaydisconnect</code></strong> de l'<a href="/en-US/docs/Web/API/WebVR_API">API WebVR</a> est déclenché lorsqu'un écran VR compatible est déconnecté de l'ordinateur.</p> +</div> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("VRDisplayEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td><code><a href="/en-US/docs/Web/API/Window/onvrdisplaydisconnect">onvrdisplaydisconnect</a></code></td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<p>Vous pouvez utiliser l'événement <code>vrdisplaydisconnect</code> dans une méthode <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener</a></code> :</p> + +<pre class="brush: js notranslate">window.addEventListener('vrdisplaydisconnect', function() { + info.textContent = 'Affichage déconnecté'; + reportDisplays(); +});</pre> + +<p>Ou utilisez la propriété du gestionnaire d'événements <code><a href="/en-US/docs/Web/API/Window/onvrdisplaydisconnect">onvrdisplaydisconnect</a></code> :</p> + +<pre class="brush: js notranslate">window.onvrdisplaydisconnect = function() { + info.textContent = 'Affichage déconnecté'; + reportDisplays(); +);</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentair</th> + </tr> + <tr> + <td>{{SpecName('WebVR 1.1', '#dom-window-onvrdisplaydisconnect', 'vrdisplaydisconnect')}}</td> + <td>{{Spec2('WebVR 1.1')}}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.vrdisplaydisconnect_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/WebVR_API">WebVR API homepage</a></li> + <li><a href="http://mozvr.com/">MozVr.com</a> — démos, téléchargements et autres ressources de l'équipe Mozilla VR.</li> +</ul> diff --git a/files/fr/web/api/window/vrdisplaypresentchange_event/index.html b/files/fr/web/api/window/vrdisplaypresentchange_event/index.html new file mode 100644 index 0000000000..d1acc663fd --- /dev/null +++ b/files/fr/web/api/window/vrdisplaypresentchange_event/index.html @@ -0,0 +1,91 @@ +--- +title: 'Window: vrdisplaypresentchange event' +slug: Web/API/Window/vrdisplaypresentchange_event +tags: + - Evènement + - Reference + - WebVR + - onvrdisplaypresentchange + - vrdisplaypresentchange +translation_of: Web/API/Window/vrdisplaypresentchange_event +--- +<div>{{APIRef("Window")}}</div> + +<div> +<p>L'événement <strong><code>vrdisplaypresentchange</code></strong> de l'<a href="/en-US/docs/Web/API/WebVR_API">API WebVR</a> est déclenché lorsque l'état de présentation d'un affichage VR change — c'est à dire passe de la présentation à la non présentation, ou vice versa.</p> +</div> + +<table class="properties"> + <tbody> + <tr> + <th scope="row">Bulles</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Annulable</th> + <td>Non</td> + </tr> + <tr> + <th scope="row">Interface</th> + <td>{{domxref("VRDisplayEvent")}}</td> + </tr> + <tr> + <th scope="row">Propriété de gestionnaire d'événements</th> + <td><code><a href="/en-US/docs/Web/API/Window/onvrdisplaypresentchange">onvrdisplaypresentchange</a></code></td> + </tr> + </tbody> +</table> + +<h2 id="Exemples">Exemples</h2> + +<p>Vous pouvez utiliser l'événement <code>vrdisplaypresentchange</code> dans une méthode <code><a href="/en-US/docs/Web/API/EventTarget/addEventListener">addEventListener</a></code> :</p> + +<pre class="brush: js notranslate">window.addEventListener('vrdisplaypresentchange', function() { + if(vrDisplay.isPresenting) { + info.textContent = "L'affichage a commencé à présenter."; + } else { + info.textContent = "L'affichage a cessé de se présenter."; + } + reportDisplays(); +});</pre> + +<p>Ou utilisez la propriété de gestionnaire d'événements <code><a href="/en-US/docs/Web/API/Window/onvrdisplaypresentchange">onvrdisplaypresentchange</a></code> :</p> + +<pre class="brush: js notranslate">window.onvrdisplaypresentchange = function() { + if(vrDisplay.isPresenting) { + info.textContent = "L'affichage a commencé à présenter."; + } else { + info.textContent = "L'affichage a cessé de se présenter."; + } + reportDisplays(); +};</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('WebVR 1.1', '#dom-window-onvrdisplaypresentchange', 'vrdisplaypresentchange')}}</td> + <td>{{Spec2('WebVR 1.1')}}</td> + <td>Définition initiale</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une pull request.</div> + +<p>{{Compat("api.Window.vrdisplaypresentchange_event")}}</p> + +<h2 id="Voir_également">Voir également</h2> + +<ul> + <li><a href="/en-US/docs/Web/API/WebVR_API">WebVR API homepage</a></li> + <li><a href="http://mozvr.com/">MozVr.com</a> — démos, téléchargements et autres ressources de l'équipe Mozilla VR.</li> +</ul> |