Есть пошаговое открытие-закрытие блоков
Т.е пользователь вводит данные в 1 блоке, нажимает далее, появляется 2 блок и т.д.
Но проблема в том, что блоки имеют разную высоту, и при переходу на след блок страница перемещается вниз, к концу след блока. Вопрос: как сделать так, чтобы после перехода на след блок экран поднялся до начала блока?
// Show step
$('.points li').click(function(){
if(!$(this).hasClass('active')){
var numberItem = $(this).attr('class').substr(5);
$('.points li').removeClass('active');
$(this).addClass('active');
$('.step').hide();
$('.step' + numberItem).show();
}
});
$('.navigation_links .prev').click(function(e){
e.preventDefault();
var numberItem, prevNumber;
$(this).parents('.steps').find('.points').find('li').each(function(){
if($(this).hasClass('active')){
numberItem = $(this).attr('class').substr(5,1);
}
});
if(numberItem != 1){
prevNumber = numberItem - 1;
$('.step').hide();
$('.step' + prevNumber).show();
$('.points li').removeClass('active');
$('.point' + prevNumber).addClass('active');
}
});
$('.navigation_links .next').click(function(e){
e.preventDefault();
var numberItem, nextNumber;
$(this).parents('.steps').find('.points').find('li').each(function(){
if($(this).hasClass('active')){
numberItem = $(this).attr('class').substr(5,1);
}
});
if(numberItem != 7){
nextNumber = Number(numberItem) + 1;
$('.step').hide();
$('.step' + nextNumber).show();
$('.points li').removeClass('active');
$('.point' + nextNumber).addClass('active');
}
});
var flag = false;
$('.country').click(function(){
if(!$(this).hasClass('active')){
$(this).addClass('active');
}else{
$(this).removeClass('active');
}
$('.country').each(function(){
bool1 = false;
if($(this).hasClass('active')){
bool1 = true;
return false;
}
});
if(bool1) {
$('.step3 .onwards').addClass('active');
}
else{
$('.step3 .onwards').removeClass('active');
}
});
$('.onwards').click(function(){
$('.navigation_links .next').click();
});
$('.onwarz').click(function(){
$('.navigation_links .prev').click();
});
var bool1 = true;
$('.revised').click(function(){
if(!$(this).hasClass('active')){
$(this).addClass('active');
}else{
$(this).removeClass('active');
}
$('.revised').each(function(){
bool1 = false;
if($(this).hasClass('active')){
bool1 = true;
return false;
}
});
if(bool1) {
$('.step5 .onwards').addClass('active');
}
else{
$('.step5 .onwards').removeClass('active');
}
});
var bool2 = true;
$('.services').click(function(){
if(!$(this).hasClass('active')){
$(this).addClass('active');
}else{
$(this).removeClass('active');
}
$('.services').each(function(){
bool2 = false;
if($(this).hasClass('active')){
bool2 = true;
return false;
}
});
if(bool2) {
$('.step6 .onwards').addClass('active');
}
else{
$('.step6 .onwards').removeClass('active');
}
});
html
<div class="step1 step">
инфа
<a href="javascript:void(0);" class="onwards button">Далее ></a>
</div>
<div class="step2 step">
инфа
<a href="javascript:void(0);" class="onwards button">Далее ></a>
</div>