mozilla

Comparaison de révisions

Détecter l'orientation de l'appareil

Change Revisions

Révision 435309 :

Révision 435309 par darnuria le

Révision 435319 :

Révision 435319 par darnuria le

Titre :
Detecting device orientation
Detecting device orientation
Identifiant d'URL :
WebAPI/Detecting_device_orientation
WebAPI/Detecting_device_orientation
Contenu :

Revision 435309
Revision 435319
n35      Tout ce dont vous avez besoin pour commencer à recevoir lesn35      Tout ce dont vous avez besoin pour commencer à recevoir les
> changements d'orientation est d’écouter l’évènement  {{ eve> changements d'orientation est d’écouter l’évènement  {{ eve
>nt("deviceorientation") }} event:>nt("deviceorientation") }} :
n80      <li>La valeur {{ domxref("DeviceOrientationEvent.gamma") }}n80      <li>La valeur {{ domxref("DeviceOrientationEvent.gamma") }}
> représente le mouvement de l'appareil autour de l'axe "x", répre> représente le mouvement de l'appareil autour de l'axe "x", expri
>senté en dégrées sur une échelle de -90° to 90°. Cela représente >mée en dégrées sur une échelle de -90° à 90°. Cela représente le 
>le mouvement de gauche à droite de l'appareil.>mouvement de gauche à droite de l'appareil.
n87      Cet exemple fonctionnant sur tout navigateur supportant : {n87      Cet exemple fonctionnant sur tout navigateur supportant : {
>{event("deviceorientation")}} l'événement et sur tout appareil ca>{event("deviceorientation")}} lévènement et sur tout appareil ca
>pable de detecter son orientation.>pable de détecter son orientation.
n138  // Parceque l'ont ne veux pas avoir l'apareil à l'envers.n138  // Parce-que l'ont ne veux pas avoir l'appareil à l'envers.
139  // On restrain les valeurs de x a l'interval [-90,90].139  // On restreint les valeurs de x à l'intervalle [-90,90].
n143  // On delimite l'interval de x et y sur [0, 180].n143  // On délimite l'intervalle de x et y sur [0, 180].
n147  // 10 est la moitier de la taille de la balle.n147  // 10 est la moiter de la taille de la balle.
148  // Cela centre le point sur le centre de la balle.148  // Cela centre le point de positionnement au centre de la balle
 >.
n150  // It center the positionning point to the center of the balln
n165        <strong>Attention :</strong> Chrome et Firefox ne gérent n164        <strong>Attention :</strong> Chrome et Firefox ne gèrent 
>pas les angles de la même façon, certaines directections sur les >pas les angles de la même façon, certaines directions sur les axe
>axes sont inversées.>s sont inversées.
n169      Traiter les événement de mouvementn168      Traiter les évènement de mouvement
170    </h2>
171    <p>169    </h2>
170    <p>
172      Les événements de mouvement gérent l'orientation de la même171      Les évènements de mouvement gèrent l'orientation de la même
> façon à l'exception près qu'ils portent un nom d'événement diffé> façon à l'exception près qu'ils portent un nom dévènement diffé
>rent : {{ event("devicemotion") }}>rent : {{ event("devicemotion") }}
n178      Ce qui change réellement est l'information retourné par l'on177      Ce qui change réellement est l'information fourni par l'obj
>bjet {{ domxref("DeviceMotionEvent") }} object pass as parameter >et {{ domxref("DeviceMotionEvent") }} passé comme paramètre par l
>of the <em>HandleMotion</em> function.>a fonction <em>HandleMotion</em>.
179    </p>
180    <p>178    </p>
181      The motion event contains four properties:179    <p>
180      Les évènement de mouvement contient quatre propriétés :
n194      Motion values explainedn193      Explication des Valeurs de mouvement
n197      The {{ domxref("DeviceMotionEvent") }} objects provide web n196      L'objet {{ domxref("DeviceMotionEvent") }} fourni aux dével
>developers with information about the speed of changes for the de>oppeurs Web des information sur la vitesse de changement d'orient
>vice's position and orientation. The changes are provided along t>ation et de position de l'appareil. Les changements rapportées so
>hree axis (see <a href="/en-US/docs/Web/Guide/DOM/Events/Orientat>nt fourni pour les trois axes (voir <a href="/en-US/docs/Web/Guid
>ion_and_motion_data_explained" title="/en-US/docs/Web/Guide/DOM/E>e/DOM/Events/Orientation_and_motion_data_explained" title="/en-US
>vents/Orientation_and_motion_data_explained">Orientation and moti>/docs/Web/Guide/DOM/Events/Orientation_and_motion_data_explained"
>on data explained</a> for details).>>Orientation et déplacement expliquées</a> pour les détails).
198    </p>
199    <p>197    </p>
198    <p>
200      For {{domxref("DeviceMotionEvent.acceleration","acceleratio199      Pour {{domxref("DeviceMotionEvent.acceleration","accelerati
>n")}} and {{domxref("DeviceMotionEvent.accelerationIncludingGravi>on")}} et {{domxref("DeviceMotionEvent.accelerationIncludingGravi
>ty","accelerationIncludingGravity")}}, those axis correspond to:>ty","accelerationIncludingGravity")}}, Les axes correspondent à :
201    </p>
202    <ul>200    </p>
203      <li>201    <ul>
204        <code>x</code>: It represents the axis from West to East
205      </li>202      <li>
203        <code>x</code>: Représente l'axe d'Ouest en Est.
206      <li>204      </li>
207        <code>y</code>: It represents the axis from South to Nort
>h 
208      </li>205      <li>
206        <code>y</code>: Représente l'axe Sud en Nord.
209      <li>207      </li>
210        <code>z</code>: It represents the axis perpendicular to t
>he ground 
211      </li>208      <li>
212    </ul>209        <code>z</code>: Représente l'axe perpendiculaire au sol.
213    <p>
214      For {{domxref("DeviceMotionEvent.rotationRate","rotationRat
>e")}}, it's a bit different, the information correspond to: 
215    </p>
216    <ul>
217      <li>210      </li>
218        <code>alpha</code>: It represents a rotation rate along t211    </ul>
>he axis perpendicular to the screen (or keyboard for desktop) 
212    <p>
213      Pour {{domxref("DeviceMotionEvent.rotationRate","rotationRa
 >te")}}, c'est un peu différente l'information correspond a :
214    </p>
215    <ul>
219      </li>216      <li>
217        <code>alpha</code>: Représente le ratio de rotation le lo
 >ng de l'axe perpendiculaire a l'écran (ou du clavier au bureau).
220      <li>218      </li>
221        <code>beta</code>: It represents a rotation rate along th
>e axis going from left to right of the plane of the screen (or ke 
>yboard for desktop) 
222      </li>219      <li>
220        <code>beta</code>: Représente le ratio de rotation le lon
 >g de l'axe allant de la gauche vers la droite de l'écran (ou du c
 >lavier au bureau).
223      <li>221      </li>
224        <code>gamma</code>: It represents a rotation rate along t
>he axis going from bottom to top of the plane of the screen (or k 
>eyboard for desktop) 
225      </li>222      <li>
223        <code>gamma</code>: Représente le ratio de rotation le lo
 >ng de l'axe allant du bas vers le haut de l'écran (ou clavier ver
 >s le bureau)
226    </ul>224      </li>
227    <p>225    </ul>
228      Finaly, {{domxref("DeviceMotionEvent.interval","interval")}226    <p>
>} represents the interval of time, in milliseconds, at which data 
> are obtain from the device. 
227      Au final, {{domxref("DeviceMotionEvent.interval","interval"
 >)}} représente l'intervalle de temps, en&nbsp; millisecondes, pou
 >r les données générées par l'appareil.
n231      Specificationsn230      Spécifications
n237            Specificationn236            Spécification
n240            Statusn239            Statuts
n243            Commentn242            Commentaire
n256            Initial specification.n255            Spécification Initiale.
n262      Browser compatibilityn261      Compatibilité entre les Navigateurs
n272              Featuren271              Technologie
n339              Featuren338              Technologie
n402      Gecko implementation notesn401      Notes d'implementation pour Gecko&nbsp;
n405      <li>Firefox 3.6, 4, and 5 supported <a href="/en-US/DOM/Mozn404      <li>Firefox 3.6, 4, et 5 supportent <a href="/en-US/DOM/Moz
>Orientation" title="MozOrientation">mozOrientation</a> versus the>Orientation" title="MozOrientation">mozOrientation</a> au lieu de
> standard {{domxref("DeviceOrientationEvent")}} event> l'événement standard {{domxref("DeviceOrientationEvent")}}.
t409      See alsot408      Voir aussi

Retour à l'historique