IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

lire en boucle une animation en jquery+setInterval.


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre du Club
    Inscrit en
    Mai 2007
    Messages
    6
    Détails du profil
    Informations forums :
    Inscription : Mai 2007
    Messages : 6
    Par défaut lire en boucle une animation en jquery+setInterval.
    Salut les amis,

    Voila, j'ai un problème avec une animation que je dois crée en jquery pour mon stage.J'ai beau essayé d'utiliser la fonction setInterval pour lire en boucle la fonction mais je ne sais pas pourquoi,la lecture se fait une fois apres plus rien.
    Je vous joins le code,s'il y a quelqu'un qui peut m'aider

    merci.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    <script type="text/javascript" language="javascript">
     
    			$(document).ready(function(){
    			 	 animation();
    				 setInterval("animation();",12000);
    			});
     
    			function animation(){
    				$('#div_0').animate({
    				"margin-top": 50,
    				"font-size":35
    				},1000, function() {
    			  		$('#div_0').delay(1500).animate({"margin-left":600,"margin-top":-400},1500);		
    				});
    				$('#div_1').delay(3000).animate({
    					"margin-left": 50,
    					"margin-top":50,
    					"font-size":35
    					},1000, function() {
    						$('#div_1').delay(1500).fadeOut();
    					});
    				$('#div_2').delay(6000).animate({
    				"margin-left": 100,
    				"font-size":35
    				},1000, function() {
    			  		$('#div_2').delay(1500).animate({"margin-top":-250},1500);
    				});
    			$('#div_3').delay(9000).animate({
    				"margin-top": 50,
    				"font-size":35
    				},1000, function() {
    			  		$('#div_3').delay(1500).fadeOut();
    				});
    				$('#div_4').delay(12000).animate({
    				"margin-top": 50,
    				"font-size":35
    				},1000, function() {
    			  		$('#div_4').delay(1500).fadeOut();
    				});
    			}
     
    </script>
     
    <style type="text/css">
    	body{font-family:Arial, Helvetica, sans-serif;}
    	#conteneur{position:relative;width:600px;margin-left:auto;margin-right:auto;height:400px;background-color:#000000;overflow:hidden;}
    	#logo{position:absolute;top:315px;left:286px;}
    	#div_0 {position:absolute;top:50px;margin-top:-400px;margin-left:50px;color:#ff6600;font-size:35PX;}
    	#div_1 {position:absolute;top:100px;margin-left:-400px;margin-top:400px;color:#ff6600;font-size:35PX;}
    	#div_2 {position:absolute;top:100px;margin-left:-500px;color:#ff6600;font-size:35PX;}	
    	#div_3 {position:absolute;top:100px;margin-top:400px;margin-left:100px;color:#ff6600;font-size:35PX;}
    	#div_4 {position:absolute;top:100px;margin-top:400px;margin-left:100px;color:#ff6600;font-size:35PX;}
    	h2{color:#fff;margin:5px;font-size:32px;}
    	span{display:block;}
    </style>
     
     
    </head>
     
     
    <body>
    <div id="conteneur">
     
    <div id="div_0">
    	<h2>accueil</h2>
    	<span> 22000 appels par mois.</span>
     
    </div>
    <div id="div_1">
    	<h2>commande</h2>
    	<span> 352 000</span>
    </div>
    <div id="div_2">
    	<h2>facturation</h2>
    	<span> 22431 </span>
    </div>
    <div id="div_3">
    	<h2>commande web</h2>
    	<span> 44221 opérations.</span>
    </div>
    <div id="div_4">
    	<h2>réclamations</h2>
    	<span>32221 réclamations traités.</span>
    </div>
    </div>

  2. #2
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Bonjour

    Attention, on passe uniquement le nom de la méthode setInterval(animation, 12000); et pas un texte !

    Si la méthode doit recevoir des arguments, on doit enrober l'appel dans une fonction anonyme :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    setInterval(function(){
       animation(arg1, arg2);
    },12000);

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

Discussions similaires

  1. Lire en boucle une vidéo flash
    Par rafexxx dans le forum Flash
    Réponses: 0
    Dernier message: 22/04/2011, 14h28
  2. Boucle FOR dans une animation
    Par vduez dans le forum ActionScript 1 & ActionScript 2
    Réponses: 4
    Dernier message: 20/05/2008, 07h44
  3. [JQuery] Passer une variable à une animation swf
    Par donfino dans le forum jQuery
    Réponses: 1
    Dernier message: 14/02/2008, 12h02
  4. Réponses: 4
    Dernier message: 11/05/2007, 19h45
  5. [FLASH MX2004] Chargement d'une animation SANS la lire
    Par sanosuke85 dans le forum Intégration
    Réponses: 2
    Dernier message: 19/12/2006, 23h22

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo