вопрос по animate
как не проигрывать снова анимацию пока не закончилась предыдущая?
|
$('#bla1').animate({opacity: 0.25}, 'slow', function() {
$('#bla2').animate({opacity: 0.25}, 'slow');
});
|
разьясню:
$('.s').click(function() {
$('.sDIV').animate('margin-left':'-=20px', 500)
})
если много раз щелкаешь - еще некоторое колл-во секунд двигается влево... как предотвратить? |
$('.s').click(function() {
$('.sDIV').not(':animated').animate('margin-left':'-=20px', 500)
})
|
Похожий вопрос, поэтому не создаю тему..
Есть меню.. при нажатии на любой пункт меню идет подгрузка заданного контента методом load.. перед этим идет анимация по увеличению высоты блока в который загружается контент. Но, если нажать на один пункт, и, не дождавшись анимации и показа загруженного изображения, нажать на другой элемент меню, то происходит неразбериха в анимации... Вот бы была функция, которая блокирует определенный яваскрипт, до полного окончания действия... |
вот, кста. код:
$("#menu td:not(#add_cook)").each(function(){
$(this).click(function(){
$("#menu td:not(#add_cook)").not($(this)).css('backgroundColor','');
$(this).css('backgroundColor','#740D13');
$id = $(this).attr('id');
$("#text").hide("drop",{direction: 'left'},600,function(){
$(this).load("php/"+$id+".php",function(){
$(this).width(760);
$conH = $(this).height();
if($("#content").height() == $conH){$time = 0;}
else{$time = 1000;}
$("#content").animate({'height':$conH},$time,function(){
$("#text").show("drop",{direction: 'right'},400);
});
});
});
});
});
Может сделать проверку при клике? Как сделать проверку, анимируется или сейчас $("#text") или нет? |
Я для этого придумывал небольшой паттерн:
$(element).one("click", function () {
var self = $(this), callee = arguments.callee;
self.animate({ ... }, 1000, function () {
self.one("click", callee);
});
});
Т.е. навешиваем на элемент обработчик, который сработает только один раз (.one() же) и когда анимация закончилась, навешиваем его вновь. |
Matre,
все бы хорошо, если бы у меня была одна кнопочка(пункт меню).. в таком варианте, функция не будет "дублироваться сама собой", но если есть два элемента? Получается анимация будет выполняться, и если я нажму на пункт меню, который только что нажал, то все ок, но если я нажму на следующий пункт меню при незавершенной анимации.. опять дабл.. |
может в начале как-то остановить анимацию если она присутствует... но как???
или проверять если идет анимация - то ждать ее завершения.. |
Для этого есть ещё один паттерн:
$(parent).one("click", function (event) {
// делаем проверку, является ли event.target элементом, клик на который нужно обработать
// делаем действия, которые я привёл в первом примере, только .one() вешаем уже на parent
});
parent — общий для обоих элементов родительский эл-т. Т.о. мы делаем один обработчик на все элементы. |
| Часовой пояс GMT +3, время: 05:05. |