Mootools - FX.Scroll ne s'arrêteront pas lorsqu'un autre événement est déclenché

Question

Je n'ai pas une très bonne compréhension de Javascript afin appologies avant de commencer.

J'ai utilisé avec succès Mootools 1.1 pour faire défiler les éléments onclick événements. Je FX.Scroll comme l'exemple ici http://demos111.mootools.net/Fx.Scroll et basiquement arraché le code de démonstration.

Remarque:. Si vous cliquez sur un lien, puis une autre rapidement arrête immédiatement le déplacement du premier élément et défile à la seconde

Je suis maintenant en train d'utiliser Mootools 1.3 pour utiliser le fondu efects pour une galerie et ont utilisé plus Builder pour obtenir FX.Scroll. Il fonctionne, mais quand je clique sur un lien, puis un autre tout de suite, il continue juste avec le premier rouleau.

Il semble que event.stop ne fonctionne pas.

Voir par exemple http://www.mytimephotography.co.uk <œuvres http://www.mytimephotography.co.uk/test

J'utilise le code:

window.addEvent('domready', function () {
  var scroll = new Fx.Scroll('scrollcontainer', {
    wait: false,
    duration: 2000,
    offset: {'x': 0, 'y': 0},
    transition: Fx.Transitions.Quad.easeInOut
  })
  $('link1').addEvent ('click', function(event){
    event = new Event(event).stop();
    scroll.toElement('c1');
  })
  //etc
})

S'il vous plaît voir tout autre code source sur le site.

Answer 1

Utilisez la propriété « lien » de l'objet d'options de Fx. La valeur par défaut est réglé sur « ignorer », ce qui est la raison pour laquelle l'animation originale conserve en cours d'exécution. Au lieu de cela, utilisez « chaîne » si vous souhaitez l'exécuter après l'animation en cours, ou « Annuler » si vous voulez interrompre l'animation en cours d'exécution.

Vous pouvez également utiliser une animation plus rapide-deux secondes est vraiment longue! :)

var scroll = new Fx.Scroll('scrollcontainer', {
    wait: false,
    duration: 2000,
    offset: {'x': 0, 'y': 0},
    transition: Fx.Transitions.Quad.easeInOut,
    link: 'cancel'
});