diff options
Diffstat (limited to 'files/fr/web/api/canvas_api/tutorial/basic_animations')
| -rw-r--r-- | files/fr/web/api/canvas_api/tutorial/basic_animations/index.md | 10 |
1 files changed, 5 insertions, 5 deletions
diff --git a/files/fr/web/api/canvas_api/tutorial/basic_animations/index.md b/files/fr/web/api/canvas_api/tutorial/basic_animations/index.md index a8b72b6e50..72075e3b32 100644 --- a/files/fr/web/api/canvas_api/tutorial/basic_animations/index.md +++ b/files/fr/web/api/canvas_api/tutorial/basic_animations/index.md @@ -13,7 +13,7 @@ original_slug: Web/API/Canvas_API/Tutoriel_canvas/Animations_basiques --- {{CanvasSidebar}} {{PreviousNext("Web/API/Canvas_API/Tutorial/Compositing", "Tutoriel_canvas/Advanced_animations")}} -Avec l'utilisation en Javascript du composant {{HTMLElement("canvas")}}, il est très simple de créer des animations (interactives). Ce chapitre décrit comment créer quelques animations basiques. +Avec l'utilisation en Javascript du composant {{HTMLElement("canvas")}}, il est très simple de créer des animations (interactives). Ce chapitre décrit comment créer quelques animations basiques. La plus grosse limitation est sans doute qu'une fois qu'une forme est dessinée, elle reste telle quelle. Si on a besoin de la déplacer, il faut la redessiner avec ce qui était dessiné avant. Cela peut prendre beaucoup de temps de redessiner des images complexes et les performances dépendront beaucoup de la vitesse de l'ordinateur qui exécute cet affichage. @@ -28,7 +28,7 @@ Voici les étapes à suivre à chaque image dessinée (frame) : 3. **Dessiner les formes animées** Vous effectuez toutes les opérations pour afficher l'image. 4. **Restaurer l'état du canevas** - Si l'état du canevas a été sauvegardé, vous restaurez cet état avant le prochain rendu. + Si l'état du canevas a été sauvegardé, vous restaurez cet état avant le prochain rendu. ## Contrôle d'une animation @@ -226,9 +226,9 @@ window.requestAnimationFrame(clock); {{EmbedLiveSample("Une_horloge_animée", "180", "180")}} -## Un panorama défilant en boucle +## Un panorama défilant en boucle -Dans cet exemple, un panorama défile de la gauche vers la droite et recommence. Nous utilisons une [image du parc Yosemite National](http://commons.wikimedia.org/wiki/File:Capitan_Meadows,_Yosemite_National_Park.jpg) récupérée sur Wikimedia, vous pouvez utiliser une autre image de votre choix qui est plus grande que le canevas. +Dans cet exemple, un panorama défile de la gauche vers la droite et recommence. Nous utilisons une [image du parc Yosemite National](http://commons.wikimedia.org/wiki/File:Capitan_Meadows,_Yosemite_National_Park.jpg) récupérée sur Wikimedia, vous pouvez utiliser une autre image de votre choix qui est plus grande que le canevas. ```js var img = new Image(); @@ -318,7 +318,7 @@ function draw() { } ``` -En dessous, vous trouvez l'élément {{HTMLElement("canvas")}} avec l'image qui défile. Notez que les dimensions de largeur et de hauteur spécifiées doivent correspondre aux valeurs des variables `CanvasXZSize` et `CanvasYSize` dans le code JavaScript. +En dessous, vous trouvez l'élément {{HTMLElement("canvas")}} avec l'image qui défile. Notez que les dimensions de largeur et de hauteur spécifiées doivent correspondre aux valeurs des variables `CanvasXZSize` et `CanvasYSize` dans le code JavaScript. ```html <canvas id="canvas" width="800" height="200"></canvas> |