@awpman

Scrollmagic, по клику на ссылку прокрутить страницу до определенного блока. Способы реализации?

Есть пример реализации анимации с помощью scrollmagic ПРИМЕР КОДА В КОТОРОМ НЕОБХОДИМО РЕАЛИЗОВАТЬ Необходимо именно под этот код создать навигационные ссылки, при клике на которые будет переход по блокам. Кто сталкивался с решением подобной задачи?
  • Вопрос задан
  • 270 просмотров
Решения вопроса 1
@awpman Автор вопроса
Вообщем сам задал вопрос, сам нашел решение. Может кому-то пригодится, ловите.
// Cсылка навигации 
    <a class="js-menu-list__link" href="#" data-scroll-index=".186"><span>мы</span></a>

    // Ловим нажатие на ссылку 
    $('.js-menu-list__link').on('click',function(){
        //Нам нужна высота body документа за минусом высоты самого экрана, тем самым мы определим область скролла всех блоков
        var scrollBlockHeight = $("body").innerHeight() - screen.height,
            //data-scroll-index - читаем значение атрибута ссылки навигации. Значение ставим ручками в данном случае оно имеет .186 - это значение progressa у scene, при котором блок "Мы" появляется при скролле
            scrollIndex = $(this).data('scroll-index'),
            // Соответственно полученную высоту главного дива мы множим на % получаем значение отступа, на которое нам надо проскроллить экран
            scrollPosition = scrollBlockHeight * scrollIndex;
            // Скроллим экран до блока "Мы" 
        $('html, body').animate({'scrollTop': scrollPosition}, 1400);
        return false;
    });

Если есть вопросы, задавайте, если есть решение проще, лучше и быстрее - выкладывайте - рад буду познакомиться с ним )
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы