Добрый день! поломал всю голову над jquery-лапшой.
Ее суть. По клику на одной из кнопок вызывается функция с аргументом от 1 до 3 (ее код будет ниже).
Функция позволяет отображать определенную секцию под спойлерами, скрывая при этом остальные.
После всего выполняется скролл к данному фрагменту контента, спойлер которого открывается. Но ввиду анимации, скроллтоп получает в качестве координаты какие-то промежуточные значения.
всю голову поломал над тем, как вычислять координату для скролла корректно, по завершении анимации. заранее спасибо за подсказки.
function smartShow(currentNumber){
switch (currentNumber) {
case 1:
(function(){
//hide # 2
$("#more_info_2").css("display", "none");
$("#content_inner_2").fadeIn("slow");
//hide # 3
$("#button_less_3").css("display", "none");
$("#more_info_3").slideUp("slow")
$("#button_more_3").fadeIn("slow");
$(".section_3").removeClass("expanded");
//show # 1
$("#button_more_1").css("display", "none");
$("#button_less_1").css("display", "inline-block");
$("#more_info_1").slideDown("slow");
}).promise().done(function() {
$('html, body').animate({
scrollTop: $('#section_' +currentNumber).offset().top
})
});
break;
case 2:
(function(){
//hide # 1
$("#button_less_1").css("display", "none");
$("#button_more_1").css("display", "inline-block");
$("#more_info_1").slideUp("slow");
//hide # 3
$("#button_less_3").css("display", "none");
$("#more_info_3").slideUp("slow")
$("#button_more_3").fadeIn("slow");
$(".section_3").removeClass("expanded");
//show # 2
$("#content_inner_2").css("display", "none");
$("#more_info_2").slideDown(1000);
}).promise().done(function() {
$('html, body').animate({
scrollTop: $('#section_' +currentNumber).offset().top
})
});
break;
case 3:
(function(){
//hide # 1
$("#button_less_1").css("display", "none");
$("#button_more_1").css("display", "inline-block");
$("#more_info_1").slideUp("slow");
//hide # 2
$("#more_info_2").css("display", "none");
$("#content_inner_2").fadeIn("slow");
//show # 3
$("#button_more_3").css("display", "none");
$("#button_less_3").css("display", "inline-block");
$("#more_info_3").slideDown("slow")
$(".section_3").addClass("expanded");
}).promise().done(function() {
$('html, body').animate({
scrollTop: $('#section_' +currentNumber).offset().top
})
});
break;
default:
return false;
}
}