@realnin

Как сделать скролл после выполнения скрипта?

Есть пошаговое открытие-закрытие блоков
Т.е пользователь вводит данные в 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>
  • Вопрос задан
  • 118 просмотров
Решения вопроса 1
@rejjer
В начало блока ставить якорь?
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы