Как сделать скрол на высоту section (100%, 100px; etc)?

Question

[Евгений]

Добрый день. Есть задача разработать страницу следующего свойства
section1 100% height
section2 1200px height
section3 150px height
При прокрутке должен срабатывать автодоводчик. Т.е. на первом secrion крутанули, страница проскролилась до section2.
Section2 крутим как обычный блок, пока не докручиваем до конца. После этого срабатывает доводчик и выводит section3. При этом таких блоков как section 2 может быть и один, и два, и больше. Копал в сторону fullpage.js, onepage-scroll-master и еще какого-то плагина. Не то. Ближе всех fullpage.js, но на страницах у которых высота больше экрана и есть кастомный скрол анимация не работает.

Answer 1

[Mikita Lisavets]

Как вариант такое:
codepen.io/FeelEnergyCB/full/jPpayj
codepen.io/FeelEnergyCB/pen/jPpayj
Решение не финальное, его бы хорошо было бы допилить. Ну а так, для старта хотя бы=)

Comments

[Евгений]

Да, спасибо подошло. Единственное смущает автоскрол скрол до верха section, при скроле с низу.

[Mikita Lisavets]

Тогда по идеи нужно поиграться с условиями в строках 25 - 30, и другие offset передавай функции анимации

[Евгений]

Ок, спасибо. Еще вопрос, можно ли по простому сделать разную скорость анимации? Или как-то с замедлением ускорения? Копаю сейчас velocity но пока не нашел решения

[Mikita Lisavets]

Можно,
easing - это тип анимации
julian.com/research/velocity/#easing

duration - длительность
julian.com/research/velocity/#duration

[Mikita Lisavets]

Немного обновил код, теперь прилипает к низу предыдущей секции когда скроллится вверх
codepen.io/FeelEnergyCB/pen/jPpayj