Как сделать анимацию при прокрутке секции в fullpage.js?

Question

[Вячеслав Яшников]

Здраствуйте, подскажите как реализовать анимацию при прокрутке секции?

В примере по ссылке
https://alvarotrigo.com/fullPage/examples/scrollin...
Секции переключаются и прокручиваются, вопрос состоит в том чтобы повесить анимацию привязанную к прокрутке колесика мыши как например тут:
scrollmagic.io
Но проблема в том что fullpage имитирует скрол изменяя свойство transform: translate(0px, 2px) у родительского блока и получается что так таковой прокрутки нет и анимация не происходит:(

Answer 1

[Сергей delphinpro]

Вячеслав Яшников у fullpage.js есть события перехода/ухода на секцию.
Вы можете слушать эти события и в обработчиках вешать/удалять классы анимаций на элементах

Comments

[Вячеслав Яшников]

С этим действительно проблем нет, тут все просто делается, а как быть с анимацией привязанной к скроллу? вот видео референс: https://www.dropbox.com/s/d7imacq755toyd7/Example%...

[Сергей delphinpro]

Вячеслав Яшников, Мне не совсем понятно, как вы в принципе хотите сделать скролл-анимацию при отсутствии скролла. Там же переключение отдельных скринов.
Если поясните, может подскажу.

Навскидку:
Скролл-анимация привязана к значению scrolltop страницы.
В fullpage этого нет. Но есть номер активного скрина. Можете привязаться к нему.

[Вячеслав Яшников]

Сергей delphinpro, там если перейти по первой ссылке на дело fyllpage видно что секции по высоте больше высоты экрана внутри проскролливаются

[Вячеслав Яшников]

Сергей delphinpro, https://yadi.sk/i/8F5izKbw3aPDfZ

Видео демонстрирующее прокрутку внутри секций

[Сергей delphinpro]

Вячеслав Яшников, ага, вижу. никогда не использовал эту возможность.
Для таких секций используется сторонний плагин для кастомизации скроллбара. Можно расковырять тот что используется по умолчанию (какой-то форкнутый IScroll) и выяснить какие у него есть коллбэки. Или подключить свой и инициализировать его через afterRender

[Вячеслав Яшников]

Сергей delphinpro, пробовал, но что-то не выходит ничего, суть в чем первые 5 экранов Сайта должны переключаться как у fullpage, а далее обычный скролл с такойтанимацией, как быть ума не приложу