PeriodicalExecuter et arrêt

Version imprimable

Bonjour,

J'essaie de faire un cycle slider avec prototype (des panneaux qui défilent à droite et à gauche quand on survole flèche de droite et de gauche).

voici la partie du code qui bloque :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 startCycle: function(direction){ if (direction == 'left') movement = this.moveLeft.bind(this); else movement = this.moveRight.bind(this); var periode = new PeriodicalExecuter(function() { // lancement du slider movement(); // placement des observers prevCnt = 0; nextCnt = 0; $('marques_prev_btn').observe('mouseout', (function(event) {event.stop();prevCnt++; console.log(prevCnt); this.stop();}).bindAsEventListener(this)); $('marques_next_btn').observe('mouseout', (function(event) {event.stop();nextCnt++; console.log(nextCnt); this.stop();}).bindAsEventListener(this)); }, 0.2); }
plus haut j'ai une fonction avec un observer en mouseover pour lancer ce script.

l'ensemble marche assez bien, seulement c'est à l'arrêt du script que ca coince. le console.log n'est pas exécuté une fois, mais n fois, et il s'exécute de plus en plus à chaque essai (la première passe s'arrête vers 7, la seconde à 12, etc...).

J'en déduis que mon event.stop ne fonctionne pas correctement, mais je ne vois pas trop pourquoi, ou alors quel code je pourrais utiliser pour faire autrement.

merci de votre aide,

modif

Bon, petite correction dans mon code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 startCycle: function(direction){
         if (direction == 'left') movement = this.moveLeft.bind(this);
         else movement = this.moveRight.bind(this);
 
        prevCnt = 0;
        nextCnt = 0;
 
         var periode = new PeriodicalExecuter(function() {
            // lancement du slider
            movement();
        }, 0.2);
 
        // placement des observers
        $('marques_prev_btn').observe('mouseout', (function(event) {event.stop();prevCnt++; console.log(prevCnt); periode.stop();}));
        $('marques_next_btn').observe('mouseout', (function(event) {event.stop();nextCnt++; console.log(nextCnt); periode.stop();}));
 
    }

maintenant que l'observer n'est plus dans le periodicalExecuter, la première fois ca marche bien (il n'exécute qu'une fois le console.log). par contre, les fois suivantes, il exécute le console.log 2 fois, puis 3, puis 4...
Je ne comprends pas d'ou ca peut venir.

Citation:

Envoyé par tnntwister

Code:

1
2
3
4
5
6
 startCycle: function(direction){
       // ...
       $('marques_prev_btn').observe('mouseout', (function(event) {event.stop();prevCnt++; console.log(prevCnt); periode.stop();}));
        $('marques_next_btn').observe('mouseout', (function(event) {event.stop();nextCnt++; console.log(nextCnt); periode.stop();}));
 
    }

...
fois suivantes, il exécute le console.log 2 fois, puis 3, puis 4...
Je ne comprends pas d'ou ca peut venir.

Chaque fois que tu appelles statCycle, tu attaches un nouveau listener sur le mouseout.

essaye :

Code:

1
2
3
4
5
6
7
8
 startCycle: function(direction){
       // ...
       $('marques_prev_btn').stopObserving('mouseout');
       $('marques_prev_btn').observe('mouseout', (function(event) {event.stop();prevCnt++; console.log(prevCnt); periode.stop();}));
       $('marques_next_btn').stopObserving('mouseout');
        $('marques_next_btn').observe('mouseout', (function(event) {event.stop();nextCnt++; console.log(nextCnt); periode.stop();}));
 
    }

11/10/2010, 16h43
tnntwister

merci merci merci ! :)