Jquery Désactiver le bouton Suivant jusqu'à ce que fin de l'animation
-
26-09-2019 - |
Question
est cool et je suis au courant. Cependant, je veux que les boutons suivant et précédent pour rester visible, mais pas être en mesure cliquez. Dans ma situation particulière, les boutons sont des images qui font partie de la conception. Je veux juste l'utilisateur de ne pas être en mesure de cliquer avant une animation se termine.
La solution
$(function(){
$("#previous").bind("click", Previous);
$("#next").bind("click", Next);
});
function DoAnimation() {
$("#previous,#next").unbind("click");
$('#id').animate(
complete: function() {
$(this).after('<div>Animation complete.</div>');
$("#previous").bind("click", Previous);
$("#next").bind("click", Next);
}
});
}
function Previous() { }
function Next() { }
Autres conseils
une autre technique:
$(".next,.prev").click(function(){
if ($('#my_animated_elelement').is(':animated'))
{
return false;
}
})
Je suppose que vous avez des appels javascript pour les images des années, utilisez un MyApp.IgnoreNextPrevClicks
variable pour signaler si les gestionnaires onclick n'exécutent ou non.
MyApp={}
MyApp.IgnoreNextPrevClicks=false;
MyApp.PrevClick=function() {
if(MyApp.IgnoreNextPrevClicks) return;
//real work goes here
}
avant d'appeler l'animateur jquery, ensemble MyApp.IgnoreNextPrevClicks
true, et le ramener à false après la fin d'animation (utilisation jquery animation rappel).
function btn() {
$('#btn').one('click', function(){
//call your animation function here.
setTimeout(btn, animation duration);
});
}
$('#mybtn').attr("disabled","disabled"); // to Disable Button
$('#mybtn').removeAttr("disabled"); // to Enable Disabled button