JQuery. Как вернуть на исходное положение страницу?

Question

[Кирилл Трифонов]

На сайте есть блок с тортами
Есть кнопка "Показать еще" - она показывает/скрывает скрытые блоки.
На телефонах, после скрытия блоков пользователь оказывается далеко внизу. Как сделать так чтобы он оказывался на месте этой кнопки после скрытия всех блоков?

Обработчик на кнопке:

$('#cakes .btn-more').click(function(e) {
        e.preventDefault();
        if ($("#cakes .hidden-item").is(":hidden")) {
            $("#cakes .hidden-item").fadeIn(100);
            $(this).text("Скрыть");
        } else {
            $("#cakes .hidden-item").fadeIn(100);
            $(this).text("Показать еще").slideToggle('#more');
        }
        return false;
    });

Comments

[Kovalsky]

Ну вот после скрытия всех блоков, скролльте окошко куда нужно:

$( 'html, body' ).animate({
    scrollTop: yourButton.offset().top
})

Answer 1

[Валера Программист]

Используйте данную библиотеку jquery.scrollTo.

https://github.com/flesler/jquery.scrollTo

Comments

[Кирилл Трифонов]

Не получается, тот же эффект.

Answer 2

[Сергей Горячев]

Началу блока прописать анкор

<span id="cakes">Якорь, до которого нужно осуществить переход.</span>

и крутить страницу к нему при втором клике

$('html,body').stop().animate({ scrollTop: $('#cakes').offset().top }, 500);

Что-то вроде такого должно выйти:

$('#cakes .btn-more').click(function(e) {
        e.preventDefault();
        if ($("#cakes .hidden-item").is(":hidden")) {
            $("#cakes .hidden-item").fadeIn(100);
            $(this).text("Скрыть");
        } else {
            $("#cakes .hidden-item").fadeIn(100);
            $(this).text("Показать еще").slideToggle('#more');
            $('html,body').stop().animate({ scrollTop: $('#cakes').offset().top }, 1000);
        }
        return false;
    });

Comments

[Kovalsky]

Ну и если не нужна анимация, то при наличии анкора можно сделать так:

location.hash = 'cakes'

[Сергей Горячев]

Никита Полевой: угу, но без анимации это будет смотреться мягко говоря так себе) я делал недавно на одном сайте тоже самое) анимация выручила)))

[Сергей Горячев]

Нашел кстати, делал вот www.fenix62.ru услуги, показать/скрыть прайс , анимацию не допиливал до ума.