Cours et tutoriaux Photoshop, Flash, Fireworks, Paintshop et sur le développement de sites Web XHTML, PHP, MySQL...

Tutorial Flash : Compte à rebours

  • Introductions

  • Informations

  • Résultat

Apercu du tutorial compte-a-rebours

Nous allons ici apprendre à réaliser un compte à rebours avec Flash et un peu d'ActionScript.
Cela peut-être utile pour annoncer l'ouverture d'un site, indiquer la fin d'une loterie, indiquer la fin d'une enchère, etc...


Avatar de netger

Auteur : WebmasterNetger

Difficulté : Facile
Création : 05/08/2006
Mise à jour : 13/11/2007

Nombre de visites : 3246


1. Créer un nouveau document flashIcone remonter en haut de page

Commençons créer un nouveau document flash possédant les propriétés suivantes :
- dimensions : 300 x 75 pixels (j'ai choisie les dimensions au hasard)
- couleur d'arrière-plan : blanc (ou une autre couleur).
- cadence : 12 images par secondes
- unité de la règle : pixels

2. Créer un champ de texte dynamiqueIcone remonter en haut de page

Commencez par placer un champ de texte dynamique sur votre scène et donnez lui comme nom de variable "affichage".

3. Insérer le code AS sur la frameIcone remonter en haut de page

Positionnez-vous sur la première frame et entrez le code AS suivant :
Code-source : AS
dateActuelle = new Date();
dateFin = new Date(2010, 0, 1, 0, 0, 0); // 1er janvier 2010 à minuit
jours = (dateFin - dateActuelle) / 1000 / 60 / 60 / 24;
jours = Math.floor(jours);
heures = (dateFin - dateActuelle) / 1000 / 60 / 60 - 24 * jours;
heures = Math.floor(heures);
minutes = (dateFin - dateActuelle) / 1000 / 60 - 1440 * jours - 60 * heures;
minutes = Math.floor(minutes);
secondes = (dateFin - dateActuelle) / 1000 - 86400 * jours - 3600 * heures - 60 * minutes;
secondes = Math.floor(secondes);

if (jours <= 1){ j = " jour "; }
else { j = " jours "; }
if (seconds == 60) { seconds = 0; }
if (minutes == 60) { minutes = 0; }
if (secondes <= 9) { secondes = "0" + secondes; }
if (minutes <= 9) { minutes = "0" + minutes; }
if (jours <= -1) { affichage = "Le décompte est terminé !!"; }
else { affichage = "il reste " + jours + j + heures + "h : " + minutes + "m : " + secondes + "s"; }

4. Insérer une nouvelle image-cléIcone remonter en haut de page

Il ne vous reste plus maintenant qu'à insérer une image-clé à la frame 2.

5. Controler l'animationIcone remonter en haut de page

Le conseil suivant vous sera utile dans tout vos travaux sous Flash : vous pouvez à tout moment tester votre animation directement dans Flash.
Cliquez sur "Contrôle" puis "tester l'animation".


Utilisez FireFoxW3C XHTML 1.0W3C CSS 2.1