Une amination avec affichage d'un séquence d'images, une par une

Soyez le premier à donner votre avis sur cette source.

Vue 18 072 fois - Téléchargée 1 930 fois

Description

se script vous permit de faire annimer vous images, en fesons une sequence d'affichages, image par image, dans l'ordre que vous choisi.
Vous remarquer qu'il faut mettre vous images dans le même répertoire que votre HTML. l'HTML est au dessus.

Source / Exemple :


<html>
 <head>
   <title> Animaition</title>
  </head>
  
  <body>
  
 <!-- afficher la 1ere image  -->        
<img src="01.jpg"  border="0" alt="Hala" height=440>
<script type="text/javascript">
<!--
 // tableau de toute la sequence
 var b = new Array();
 b[0] = new Image(); b[0].src = "02.jpg";
 b[1] = new Image(); b[1].src = "03.jpg";
 b[2] = new Image(); b[2].src = "04.jpg";
 b[3] = new Image(); b[3].src = "05.jpg";
 b[4] = new Image(); b[4].src = "06.jpg";
 b[5] = new Image(); b[5].src = "07.jpg";
 b[6] = new Image(); b[6].src = "08.jpg";
 b[7] = new Image(); b[7].src = "09.jpg";
 b[8] = new Image(); b[8].src = "10.jpg";
 b[9] = new Image(); b[9].src = "01.jpg";
 var i = 0;
 

 
 function Animation()
 {
  if(i > 9) i = 0;
  document.images[0].src = b[i].src;
  i = i + 1;
  window.setTimeout("Animation()",2000);
//On affiche chaque image pendant 2s
 }

 window.setTimeout("Animation()",2000);
 
 
 
//-->
</script>
</body></html>

Conclusion :


Pour plus d'info conntecter moi sur mon e-mail.
Vous trouvez dans le ZIP dix images d'exemple.

Codes Sources

A voir également

Ajouter un commentaire Commentaires
Messages postés
1
Date d'inscription
mercredi 16 février 2011
Statut
Membre
Dernière intervention
19 février 2011

Bonjour et merci pour ce code !

je voudrais savoir si il serait possible d'afficher ces images aléatoirement ?
Messages postés
27
Date d'inscription
vendredi 15 octobre 2010
Statut
Membre
Dernière intervention
12 août 2012

super code merci
Messages postés
3
Date d'inscription
mercredi 17 février 2010
Statut
Membre
Dernière intervention
17 février 2010

Bonjour je suis sous firefox, et je n'arriv pas O_o

Dsl de relancer un sujet si vieux mais je débute et je voudrais bien connaître le html et javascript, pour peut etre un jour en faire mwa meme =)))

le code que j'ai ==

--------------------------

#
# <script type="text/javascript">
# var b = new Array();
# b[0] = new Image(); b[0].src = "http://blogue.biotope.ca/wp-images/google-chrome-logo.png";
# b[1] = new Image(); b[1].src = "http://www.informanews.net/imagenews/panasonicTV_Google.jpg";
# b[2] = new Image(); b[2].src = "http://www.onlineradio.fr/wp-content/uploads/2009/09/google.jpg";
# b[3] = new Image(); b[3].src = "http://www.abondance.com/Bin/google-dollars.jpg";
# b[4] = new Image(); b[4].src = "http://blogs.lexpress.fr/e-veille-marketing/google_youtube_400q.jpg";
# b[5] = new Image(); b[5].src = "http://businessenligne.files.wordpress.com/2009/04/google1.jpg";
# b[6] = new Image(); b[6].src = "http://www.geoinweb.com/wp-content/uploads/2007/WindowsLiveWriter3/ExclusifGoogleLocationGooglepeutvousgolo_CB94/google_watching_you_independent_newspaper_24_may_20071.png";
# b[7] = new Image(); b[7].src = "http://www.seopob.com/img/logo-google-chrome.jpg";
# b[8] = new Image(); b[8].src = "http://www.alpha-geek.fr/public/eau_de_toilette_google_2.jpg";
# b[9] = new Image(); b[9].src = "http://innovationweb.branchez-vous.com/upload/2007/06/google-street-view.jpg";
# var i = 0;

# function Animation()
# {
# if(i > 9) i = 0;
# document.images[0].src = b[i].src;
# i = i + 1;
# window.setTimeout("Animation()",2000);
# }
# window.setTimeout("Animation()",2000);
# </script>

-------------------------

merci a tous...

xmO
Messages postés
5
Date d'inscription
jeudi 27 mars 2008
Statut
Membre
Dernière intervention
1 juillet 2008

Bonjour, très bien ce site mais comment faire pour que les images s'affichent aléatoirement ?
merci pour qui aura la réponse.
à bientôt
Messages postés
274
Date d'inscription
jeudi 22 novembre 2007
Statut
Membre
Dernière intervention
14 avril 2016
3
Bonjour. Je ne comprend pas trop le prioncipe de mettre les images dans le même répertoire que votre HTML? est-il possible d'avoir plus d'informations svp?

Merci

Jacques
Afficher les 9 commentaires

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.