[ Поиск ] - [ Пользователи ] - [ Календарь ]
Полная Версия: click
VeRTak

function navMenu(link) {
$(".link-"+link).on("click", function () {
$(".nav-active").animate({
"top": "-93vh"
}, 1000).removeClass("nav-active");
function navActivate() {
$("."+link).animate({
"top": "0"
}, 1000).addClass("nav-active");
}
setTimeout(navActivate, 1000);
});
}


В чем суть. Справа есть навигация из 8 ссылок, слева контент который выскакивает сверху от того по какой ссылке кликнуть. Если очень быстро кликать по ссылкам, проскакивает две ссылки по нажатию и само собой два контента выезжают сверху. Как обойти?
walerus
VeRTak
Может "тушить" остальные пункты меню при нажатии и активировать через... n секунд назад. Хотя не совсем понял - контент сразу подгружен и спрятан ?
comolov
Можно ввести флаг animated, который отслеживает состояние анимации и не позволяет выполнится никакому клику пока анимация работает. Покажи html. Похоже setTimeout лишний здесь.
VeRTak
Цитата (walerus @ 26.04.2017 - 21:57)
Может "тушить" остальные пункты меню при нажатии и активировать через... n секунд назад.


Ну да как вариант smile.gif

Цитата (walerus @ 26.04.2017 - 21:57)
контент сразу подгружен и спрятан ?


Ага, оно самое
VeRTak
Цитата (comolov @ 26.04.2017 - 23:02)
Можно ввести флаг animated, который отслеживает состояние анимации и не позволяет выполнится никакому клику пока анимация работает


Речь идет о http://api.jquery.com/animated-selector/ ???

Я не понимаю, как данный вариант тут поможет
Kusss
как-то так наверно. Если до начала анимации кликнули второй раз, прервать запущенную.
var open_closed;
function navMenu(link) {
$(".link-"+link).on("click", function () {
clearTimeout(open_closed);

$(".nav-active").animate({
"top": "-93vh"
}, 1000).removeClass("nav-active");

open_closed = setTimeout(navActivate(link), 1000);
});
}
function navActivate(link) {
$("."+link).animate({
"top": "0"
}, 1000).addClass("nav-active");
}
sergeiss
Kusss, тут еще лучше сделать инициализацию open_closed. Затем перед clearTimeout() надо проверить, а было ли оно инициализировано. При первом входе в функцию не будет инициализировано. И затем надо open_closed обнулить, после очистки.

_____________
* Хэлп по PHP
* Описалово по JavaScript
* Хэлп и СУБД для PostgreSQL

* Обучаю PHP, JS, вёрстке. Интерактивно и качественно. За разумные деньги.

* "накапливаю умение телепатии" (С) и "гуглю за ваш счет" (С)

user posted image
Kusss
Я вообще средне знаю jquery. Если не сложно - напиши как это будет выглядеть . Мне, да и не только, на будущее.
VeRTak
Kusss В общем то работает. Но сейчас они одновременно работают, блоки вместе отрабатывают, один уезжает наверх, другой выезжает сверху. Я setTimeout ставил для того что бы, сначала один отработал затем второй. Спасибо. Сейчас буду думать как подправить. Сам в jquery еще чайник smile.gif
comolov
Цитата
Речь идет о http://api.jquery.com/animated-selector/ ???

Нет, тут имел ввиду другое.

Цитата
setTimeout ставил для того что бы, сначала один отработал затем второй

Есть свойство complete для функции animate, оно принимает функцию, которая выполнится после завершения анимации. И setTimeout не нужет тогда.

$(".nav-active").animate({
"top": "-93vh"
}, 1000).removeClass("nav-active");

Класс удалится сразу, он не будет дожидаться окончания анимации. Это ли нужно?


Примерно это имел ввиду.
var animated = false;
var duration = 1000;

function navMenu(link) {

$(".link-"+link).on("click", function () {

if(animated) {
return;
}

animated = true;

$na = $(".nav-active");
$na.animate({ "top": "-93vh" }, {
duration: duration,
complete: function() {
$na.removeClass("nav-active");

var $link = $("."+link);
$link.animate({ "top": "0" }, {
duration: duration,
complete: function() {
$link.addClass("nav-active");
animated = false;
}
}
);
}
}
);
});
}
Быстрый ответ:

 Графические смайлики |  Показывать подпись
Здесь расположена полная версия этой страницы.
Invision Power Board © 2001-2024 Invision Power Services, Inc.