#html #video #frame #scrollmagic
#HTML #Видео #кадр #scrollmagic
Вопрос:
Hey SO members,
Я хочу воспроизводить видео HTML5 взад и вперед вместе со прокруткой. Анимация управляет видео кадр за кадром в зависимости от количества прокрутки.
Я закодировал (это легко и очень просто) это с помощью ScrollMagic. Встроенное видео также легкое (пробовал уродливые / уменьшенные видео с теми же результатами).
Проблема, с которой я сталкиваюсь, заключается в том, что при плавной прокрутке анимация выглядит едва плавной. Но при быстрой прокрутке, как будто многие кадры отбрасываются. Я бы предположил, что это может быть нормально, если процент прогресса упадет, например, с 50% до 75%. Но это не так. Процентное значение, отображаемое в консоли, показывает, что процентное значение обновляется плавно, некоторые кадры не отображаются и получаются в виде нарезанной анимации. Я бы хотел, чтобы это было плавно, независимо от того, насколько быстро пользователь прокручивает. Есть мысли?
Ответ №1:
В конце концов я понял, что видео является ключевым. MP4 должен иметь очень низкий интервал ключевых кадров (2 в моем случае, вместо обычно 10), чтобы обеспечить плавную прокрутку, особенно при прокрутке вверх. Кроме того, сначала загрузите mp4, поскольку воспроизведение webm требует больше ресурсов процессора. Теперь все идеально гладко.
Я обновил свой jsfiddle.