Forum : Probléme setInterval

Bonjour,

Voilà mon souci, j'ai créé une petite animation qui tourne en boucle mais le souci c'est que l'animation ne commence qu'au bout de 27 secondes, soit le temps de ma boucle en fait.

Quelqu'un aurait une idée de comment faire pour que l'animation commence directement et non pas au bout de 27 secondes ?

Merci ;)

$(function(){
        setInterval(function(){
            $(".ref-bloc .ref").fadeTo(0, 0);
            $(".ref-bloc .ref.one").fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
            $(".ref-bloc .ref.two").delay(delay_duration_two).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
            $(".ref-bloc .ref.three").delay(delay_duration_three).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
            $(".ref-bloc .ref.four").delay(delay_duration_four).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
            $(".ref-bloc .ref.five").delay(delay_duration_five).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
            $(".ref-bloc .ref.six").delay(delay_duration_six).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
        }, 27000);
    });

Pewel-OutOfNutella

Réponse acceptée

Il faut appeler ta fonction une première fois, comme un appel de fonction basique. Soit dans le onload, soit dans le document.ready.

Exemple :

(function($){
        $(document).ready(function() {
            test();
        });
})(jQuery);
function test() {
    alert("test");
}
setInterval(function() {  
    test();
}, 10000);

Gyuki

Bonjour,

Ce Que j'aurais fait, c'est placer ton code qui est dans le setinterval dans une fonction, appeler cette fonction puis le setintervale avec la fonction passée en paramètre.

$(function(){
    function test (){
    $(".ref-bloc .ref").fadeTo(0, 0);

        $(".ref-bloc .ref.one").fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
        $(".ref-bloc .ref.two").delay(delay_duration_two).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
        $(".ref-bloc .ref.three").delay(delay_duration_three).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
        $(".ref-bloc .ref.four").delay(delay_duration_four).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
        $(".ref-bloc .ref.five").delay(delay_duration_five).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
        $(".ref-bloc .ref.six").delay(delay_duration_six).fadeTo(fade_duration, 1).fadeTo(fade_duration, 0);
    }
    test ();
    setInterval(function(){ test (); }, 27000);
});

Antony CARON

Auteur

Le problème reste le même, j'ai essayer de faire une autre animation du genre et rien n'y fait, il y a toujours un délai équivalent au temps de ma boucle...

antho07

Bonjour ta première syntaxe est censée marché , en tout cas pour la structure du setInterval

ça :

var timer = setInterval(function(){ ....... } ,10000);

ça fonctionne

Le problème est peut être ailleurs,

jquery est bien chargé?
qu'indique la console javascript ?

t'as essayé de mettre un alert tout en haut de la fonction pour voir si on rentre bien dedans?

Si oui, point d'arrêt pour voir ou ça pete avec le debugguer chrome ou autre..

bien cordialement

Antho

Edit: je sais pas si la façon dont tu attends que jquery soit chargé est bonne :

essaye plutot

$(document).ready(function(){

Le code ici
});

Pewel-OutOfNutella

Antho, va tester sur jsfiddle ou en local, j'avais eu le même problème, ça ne fonctionne pas. Si on veut un affichage tout de suite, il faut appeler la méthode comme un appel standard.

antho07

ah j'avais pas tout lu ... bah vi .. setInterval c un sablier que tu retournes toute les x secondes.. mais au début il est plein.., j'avais pas lu que le problème était le point de départ et pas la fonction elle même, au temps pour moi, m'apprendra à pas être attentif ><

Antony CARON

Auteur

C'est bon ... Merci Pewel ;)

-> JsFiddle

Probléme setInterval

7 réponses