path: root/files/fr/archive/mozilla/xul/scale/index.html

---
title: scale
slug: Archive/Mozilla/XUL/scale
tags:
  - Éléments_XUL
translation_of: Archive/Mozilla/XUL/scale
---
<div class="noinclude"><span class="breadcrumbs XULRef_breadcrumbs">
 « <a href="/fr/docs/Référence_XUL">Accueil de la référence XUL</a>    [
 <a href="#Exemples">Exemples</a> |
 <a href="#Attributs">Attributs</a> |
 <a href="#Propri.C3.A9t.C3.A9s">Propriétés</a> |
 <a href="#M.C3.A9thodes">Méthodes</a> |
 <a href="#Sujets_li.C3.A9s">Sujets liés</a> ]
</span></div> <p>Un élément <code>scale</code> (parfois appelé <i>slider</i>) permet à l'utilisateur de sélectionner une valeur dans un intervalle. Une barre affichée horizontalement ou verticalement lui permet de choisir une valeur en glissant une poignée sur la barre.
</p><p>Utilisez l'attribut <code>orient</code> pour spécifier l'orientation de l'échelle. La valeur par défaut est &lt;tt&gt;horizontal&lt;/tt&gt; qui affiche une barre horizontale. Les valeurs inférieures sont à gauche et les valeurs supérieurs à droite. Pour utiliser une échelle verticale, définissez l'attribut <code>orient</code> à &lt;tt&gt;vertical&lt;/tt&gt;.
</p><p>L'utilisateur peut utiliser les touches fléchées du clavier pour incrémenter ou décrémenter la valeur d'une unité, ou les touches <kbd>PagePréc</kbd> et <kbd>PageSuiv</kbd> pour incrémenter ou décrémenter la valeur d'une page, telle que spécifiée par l'attribut <code>pageincrement</code>. Les touches <kbd>Origine</kbd> et <kbd>Fin</kbd> définissent respectivement la valeur au minimum et au maximum. Un évènement <code>change</code> sera déclenché par l'élément chaque fois que sa valeur est modifiée.
</p>
<dl><dt> Attributs
</dt><dd> <a href="#a-dir">dir</a>, <a href="#a-disabled">disabled</a>, <a href="#a-increment">increment</a>, <a href="#a-max">max</a>, <a href="#a-min">min</a>, <a href="#a-pageincrement">pageincrement</a>, <a href="#a-tabindex">tabindex</a>, <a href="#a-value">value</a>
</dd></dl>
<dl><dt> Propriétés
</dt><dd> <a href="#p-disabled">disabled</a>, <a href="#p-max">max</a>, <a href="#p-min">min</a>, <a href="#p-increment">increment</a>, <a href="#p-pageIncrement">pageIncrement</a>, <a href="#p-tabIndex">tabIndex</a>, <a href="#p-value">value</a>, </dd></dl>
<dl><dt> Méthodes
</dt><dd> <a href="#m-decrease">decrease</a>, <a href="#m-decreasePage">decreasePage</a>, <a href="#m-increase">increase</a>, <a href="#m-increasePage">increasePage</a>,
</dd></dl>
<h3 id="Exemples" name="Exemples"> Exemples </h3>
<p>Échelle horizontale :
</p>
<pre>&lt;scale min="1" max="10"/&gt;
</pre>
<p><img alt="Image:Controlguide-scale.png">
</p><p>Échelle verticale :
</p>
<pre>&lt;scale min="1" max="10" orient="vertical"/&gt;
</pre>
<h3 id="Attributs" name="Attributs"> Attributs </h3>
<p>
</p><div id="a-dir">

<dl>
 <dt>
  <code id="a-dir"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/dir">dir</a></code></dt>
 <dd>
  Type :
  <i>
   une des valeurs ci-dessous</i>
 </dd>
 <dd>
  La direction dans laquelle les éléments enfants de l'élément seront placés.</dd>
</dl>
<ul>
 <li><code>normal</code> : &lt;magic name="\"PAGENAME\"/"&gt;Les valeurs de l'échelle sont triées de gauche à droite (pour les échelles horizontales) ou de haut en bas (pour les échelles verticales)., Les éléments sont placés de gauche à droite ou de haut en bas dans l'ordre dans lequel ils apparaissent dans le code XUL.)&lt;/magic&gt;</li>
 <li><code>reverse</code> : Les valeurs de l'échelle sont triées de droite à gauche (pour les échelles horizontales) ou de bas en haut (pour les échelles verticales)., Les éléments sont placés de droite à gauche ou de bas en haut. C'est le contraire de l'ordre dans lequel ils apparaissent dans le code XUL.)</li>
</ul>

<p> </p>
</div>
<div id="a-disabled">

<dl><dt> <code id="a-disabled"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/disabled">disabled</a></code>
</dt><dd> Type : <i>booléen</i>
</dd><dd> Indique si l'élément est ou non désactivé. Si cette valeur est définie à <code>true</code>, l'élément est désactivé. Les éléments désactivés sont habituellement affichés avec leur texte grisé. Si l'élément est désactivé, il ne répond pas aux actions de l'utilisateur, il ne peut pas recevoir le focus, et l'évènement <code>command</code> ne se déclenchera pas. </dd></dl>
<p><br>
</p>
<div class="float-right"><img alt="Image:XUL_ref_attr_disabled.png"></div>
<pre>&lt;!-- La case à cocher active/désactive le bouton --&gt;
&lt;checkbox label="Enable button"
    onclick="document.getElementById('buttRemove').disabled = this.checked"/&gt;
&lt;button id="buttRemove" label="Remove All" disabled="true"/&gt;
</pre>
</div>
<div id="a-increment">

<dl>
 <dt>
  <code id="a-increment"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/increment">increment</a></code></dt>
 <dd>
  Type :
  <i>
   entier</i>
 </dd>
 <dd>
  La quantité dont l'attribut <code id="a-value"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/value">value</a></code> (pour les boîtes numériques et les échelles) or <code id="a-curpos"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/curpos">curpos</a></code>&lt;magic name="\"PAGENAME\"/"&gt; (pour les barres de défilement) &lt;/magic&gt; change lorsque l'on clique sur les flèches. La valeur par défaut est 1.</dd>
</dl>
</div>
<div id="a-min">

<dl>
 <dt>
  <code id="a-min"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/min">min</a></code></dt>
 <dd>
  Type :
  <i>
   entier</i>
 </dd>
 <dd>
  La valeur minimum que peut prendre l'élément. La valeur par défaut est 0.</dd>
</dl>
</div>
<div id="a-max">

<dl>
 <dt>
  <code id="a-max"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/max">max</a></code></dt>
 <dd>
  Type :
  <i>
   entier</i>
 </dd>
 <dd>
  La valeur maximum que peut prendre l'élément scale ou number box. La valeur par défaut est <code>100</code> pour les éléments scale et <code>Infinity</code> pour les boîtes numériques</dd>
</dl>
</div>
<div id="a-pageincrement">

<dl>
 <dt>
  <code id="a-pageincrement"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/pageincrement">pageincrement</a></code></dt>
 <dd>
  Type :
  <i>
   entier</i>
 </dd>
 <dd>
  La quantité de laquelle la valeur de l'attribut <code>curpos</code> ou <code>value</code> change lorsque l'utilisateur clique dans la colonne de la barre de défilement (la zone dans laquelle le curseur de la barre se déplace), ou lorsque les touches <kbd>PgUp</kbd> ou <kbd>PgDown</kbd> sont utilisées. La valeur par défaut est 10.</dd>
</dl>
</div>
<div id="a-tabindex">

<dl><dt> <code id="a-tabindex"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/tabindex">tabindex</a></code>
</dt><dd> Type : <i>entier</i>
</dd><dd> L'ordre de tabulation de l'élément. L'ordre de tabulation est l'ordre dans lequel le focus se déplace lorsque l'utilisateur appuie sur la touche « tab ». Les éléments dont le <code>tabindex</code> est plus haut se trouvent plus tard dans la séquence de tabulation.
</dd></dl>


</div>
<div id="a-value">

<dl><dt> <code id="a-value"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/value">value</a></code>
</dt><dd> Type : <i>chaîne</i>
</dd><dd> Cet attribut chaîne permet d'associer une valeur de données avec un élément. Il n'est destiné à aucune utilisation particulière, mais vous pouvez y accéder avec un script pour votre usage propre..
</dd></dl>


</div>

<h3 id="Propri.C3.A9t.C3.A9s" name="Propri.C3.A9t.C3.A9s"> Propriétés </h3>
<p>
</p><div id="p-disabled">
<dl><dt> <code><span><a href="https://developer.mozilla.org/fr/docs/XUL/Propri%C3%A9t%C3%A9s/disabled">disabled</a></span></code>
</dt><dd> Type : <i>booléen</i>
</dd><dd> Obtient et définit la valeur de l'attribut <code id="a-disabled"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/disabled">disabled</a></code>.
</dd></dl>

</div>
<div id="p-increment">
<dl>
  <dt>
    <code><span><a href="https://developer.mozilla.org/fr/docs/XUL/Propri%C3%A9t%C3%A9s/increment">increment</a></span></code></dt>
  <dd>
    Type : <i>entier</i></dd>
  <dd>
    Obtient et définit la valeur de l'attribut <code id="a-increment"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/increment">increment</a></code>.</dd>
</dl></div>
<div id="p-min">
<dl><dt> <code><span><a href="https://developer.mozilla.org/fr/docs/XUL/Propri%C3%A9t%C3%A9s/min">min</a></span></code>
</dt><dd> Type : <i>entier</i>
</dd><dd> Obtient et définit la valeur de l'attribut <code id="a-min"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/min">min</a></code>.
</dd></dl>
<p><br>
</p>

</div>
<div id="p-max">
<dl><dt> <code><span><a href="https://developer.mozilla.org/fr/docs/XUL/Propri%C3%A9t%C3%A9s/max">max</a></span></code>
</dt><dd> Type : <i>entier</i>
</dd><dd> Obtient et définit la valeur de l'attribut <code id="a-max"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/max">max</a></code>.
</dd></dl>
<p><br>
</p>

</div>
<div id="p-pageIncrement">
<dl><dt> <code><span><a href="https://developer.mozilla.org/fr/docs/XUL/Propri%C3%A9t%C3%A9s/pageIncrement">pageIncrement</a></span></code>
</dt><dd> Type : <i>entier</i>
</dd><dd> Obtient et définit la valeur de l'attribut <code id="a-pageincrement"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/pageincrement">pageincrement</a></code>.
</dd></dl>
<p><br>
</p>

</div>
<div id="p-tabIndex">
<dl><dt> <code><span><a href="https://developer.mozilla.org/fr/docs/XUL/Propri%C3%A9t%C3%A9s/tabIndex">tabIndex</a></span></code>
</dt><dd> Type : <i>entier</i>
</dd><dd> Obtient et définit la valeur de l'attribut <code id="a-tabindex"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/tabindex">tabindex</a></code>.
</dd></dl>

</div>
<div id="p-value">
<dl><dt> <code><span><a href="https://developer.mozilla.org/fr/docs/XUL/Propri%C3%A9t%C3%A9s/value">value</a></span></code>
</dt><dd> Type : <i>chaîne</i>
</dd><dd> Obtient et définit la valeur de l'attribut <code id="a-value"><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Attributs/value">value</a></code>.
</dd></dl>

</div>

<h3 id="M.C3.A9thodes" name="M.C3.A9thodes"> Méthodes </h3>
<p><span class="lang lang-fr" lang="fr">
</span></p><table style="border: 1px solid rgb(204, 204, 204); margin: 0px 0px 10px 10px; padding: 0px 10px; background: rgb(238, 238, 238) none repeat scroll 0% 50%;"> <tbody> <tr> <td> <p><strong>Héritées de XUL element</strong><br> <small> <span id="m-blur"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Méthodes/blur">blur</a></code></span>, <span id="m-click"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Méthodes/click">click</a></code></span>, <span id="m-doCommand"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Méthodes/doCommand">doCommand</a></code></span>, <span id="m-focus"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Méthodes/focus">focus</a></code></span>, <span id="m-getElementsByAttribute"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/Méthodes/getElementsByAttribute">getElementsByAttribute</a></code></span></small></p> <p><strong>Héritées de DOM element</strong><br> <small> <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.addEventListener">addEventListener()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.appendChild">appendChild()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.dispatchEvent">dispatchEvent()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.getAttribute">getAttribute()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.getAttributeNode">getAttributeNode()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.getAttributeNodeNS">getAttributeNodeNS()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.getAttributeNS">getAttributeNS()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.getElementsByTagName">getElementsByTagName()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.getElementsByTagNameNS">getElementsByTagNameNS()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.hasAttribute">hasAttribute()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.hasAttributeNS">hasAttributeNS()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.hasAttributes">hasAttributes()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.hasChildNodes">hasChildNodes()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.insertBefore">insertBefore()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.isSupported">isSupported()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.normalize">normalize()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.removeAttribute">removeAttribute()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.removeAttributeNode">removeAttributeNode()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.removeAttributeNS">removeAttributeNS()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.removeChild">removeChild()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.removeEventListener">removeEventListener()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.replaceChild">replaceChild()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.setAttribute">setAttribute()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.setAttributeNode">setAttributeNode()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.setAttributeNodeNS">setAttributeNodeNS()</a></code>, <code><a href="https://developer.mozilla.org/fr/docs/DOM/element.setAttributeNS">setAttributeNS()</a></code></small></p> </td> </tr> </tbody>
</table>
<dl>
 <dt>
  <span id="m-decrease"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/M%C3%A9thodes/decrease">decrease()</a></code></span></dt>
 <dd>
  Type de retour :
  <i>
   aucune valeur de retour</i>
 </dd>
 <dd>
  Diminue la valeur de&lt;magic name="\"PAGENAME\"/"&gt; la boîte numérique l'échelle, l'échelle ou la boîte numérique&lt;/magic&gt; de la valeur de l'incrément.</dd>
</dl>
<dl><dt> <span id="m-decreasePage"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/M%C3%A9thodes/decreasePage">decreasePage()</a></code></span></dt>
<dd> Type de retour : <i>aucune valeur de retour</i>
</dd><dd> Diminue la valeur de l'échelle de la valeur de <code>pageIncrement</code>.
</dd></dl>
<p><br>
</p>
<dl>
 <dt>
  <span id="m-increase"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/M%C3%A9thodes/increase">increase()</a></code></span></dt>
 <dd>
  Type de retour :
  <i>
   aucune valeur de retour</i>
 </dd>
 <dd>
  Augmente la valeur de &lt;magic name="\"PAGENAME\"/"&gt;la boîte numérique, XUL:scale = l'échelle, l'échelle ou la boîte numérique&lt;/magic&gt; de la valeur de l'incrément.</dd>
</dl>
<p> </p>


<dl><dt> <span id="m-increasePage"><code><a href="https://developer.mozilla.org/fr/docs/Mozilla/Tech/XUL/M%C3%A9thodes/increasePage">increasePage()</a></code></span></dt>
<dd> Type de retour : <i>aucune valeur de retour</i>
</dd><dd> Augmente la valeur de l'échelle de la valeur de <code>pageIncrement</code>.
</dd></dl>
<p><br>
</p>

<h3 id="Sujets_li.C3.A9s" name="Sujets_li.C3.A9s"> Sujets liés </h3>
<dl><dt> Interfaces
</dt><dd> <a href="fr/NsIDOMXULControlElement">nsIDOMXULControlElement</a>
</dd></dl>
<div class="noinclude">
</div>