Question

J'ai une fonction courte qui devrait afficher des messages sur un site Web.

function showHint() { 
    $('#notify').html('message text').show('slide', {direction: 'right'}, 500);
}

Et il existe une autre fonction qui masque les messages.

function hideHint() { 
    $('#notify').hide('slide', {direction: 'right'}, 500);
}

Le problème est que si j'appelle cette fonction plusieurs fois, elle essaie d'afficher tous les messages en même temps et tout se casse. Je veux appeler la fonction deux fois et ensuite il devrait mettre les animations en file d'attente et afficher un message après l'autre. La fonction doit être appelée plus d'une fois à la fois mais affichée une par une. Le message suivant doit apparaître lorsque le sapin se cache.

Comment pourrais-je résoudre le problème? Serait bien!

Était-ce utile?

La solution

Voici un mini plug-in personnalisé que j'ai utilisé par le passé qui enchaîne plusieurs animations, l'une après l'autre.

// Good for serializing animations
$.fn.chain = function(fn) {
  var elements = this;
  var i = 0;
  function nextAction() {
    if (elements.eq(i)) fn.apply(elements.eq(i), [nextAction]);
    i++;
  }
  nextAction();
};

Vous pouvez l'appeler ainsi ( en voici un exemple . ):

$(document).ready(function() {
  $('li').chain(function(nextChain) { this.slideToggle("fast", nextChain); });
});

La fonction que vous passez à la chaîne de la chaîne transmet une autre fonction que vous devez appeler lorsque vous êtes arrêté avec un cycle. Dans l'exemple ci-dessus, nous passons simplement la fonction nextChain en tant que rappel au slideToggle .

Autres conseils

Votre fonction showhint pourrait simplement commencer par masquer la notification et, une fois celle-ci terminée, le rappel serait ce qui est la fonction showhint existante, cela changerait le texte et l'afficherait. Le code ne devrait pas être difficile compte tenu de ce que vous avez déjà fait.

ne pouvez-vous pas simplement utiliser un plugin de notification? voici deux ( un , deux ) qui sont assez voluptueux.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top