Как анимировать событие прокрутки вниз/вверх?

Question

Как анимировать прокрутку вниз/вверх в JQuery, как на этом сайте: union.co

И предотвратить несколько анимаций/событий

Я использовал этот код, но он работает только в первый раз:

var lastScrollTop = 0;
$(window).scroll(function (event) {
    var st = $(this).scrollTop();
    if (st > lastScrollTop) {
        $(window).scrollTop("#div1");
    } else {
        $(window).scrollTop("#div0");
    }
    lastScrollTop = st;
});

javascript jquery

-1

Mike 29 Окт 2014 в 18:36

Этого легко добиться с помощью плагина fullPage.js.

–

Alvaro

29 Окт 2014 в 20:01

Answer 1

Возможно, часть этого поможет:

var i;
$(window).scroll(function (event) {
    $('html, body').animate({ scrollTop: $('#myid1').offset().top }, 500);
    i++
});

Узнайте, как использовать переменную в id и имя id на каждом «экране».

0

mateusz-c 29 Окт 2014 в 18:51

Answer 2

Существует ряд плагинов, которые вы можете использовать для достижения того, что ищете. Раньше я работал с onepage-scroll, прежде чем использовать собственный плагин.

На сайте, который вы приводите в качестве примера, используется bxslider, адаптивный слайдер контента jQuery. Это не делает именно то, что вы просите. Это всего лишь слайдер контента. Вы должны добавить еще несколько строк, чтобы иметь возможность прокручивать страницу.

Плагин fullPage.js, предложенный Alvaro также очень хороший плагин. Кроме того, он поддерживает изменение размера окна.

Выберите один плагин. Документация очень понятная. Если у вас возникнут какие-либо проблемы, дайте мне знать. Я буду рад помочь.

Надеюсь, это будет полезно!

0

Community 23 Май 2017 в 15:05

Как анимировать событие прокрутки вниз/вверх?

2 ответа

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

Новые вопросы

javascript