У меня есть простая HTML-страница, и я проигрываю на ней видео. Я использую полосу прокрутки как полосу поиска. Другими словами, видео воспроизводится до тех пор, пока пользователь прокручивает.
Я видел, как этот эффект использовался в паре мест, и хотел создать его сам. Написанный мной скрипт полностью функционирует, но есть небольшая проблема: само видео.
Видео из примеров работают плавно, но видео, которые я создал, отстают. Кажется, я не могу понять причину. Я пробовал разные комбинации FPS, разрешения, битрейта, но они не помогли.
Единственное различие между видео, которое я смог найти, заключается в том, что когда я воспроизводю видео из примеров, я могу искать любой кадр в MPC (K-Lite). Я могу искать только 3-4 кадра на созданных мной видео. Так что проблема может быть связана с этим. Я не уверен. Если речь идет об этом, мне нужен способ сделать видео полностью доступными для поиска. Как я могу это сделать?
https://akinuri.github.io/sticky-scrollable-video/ (онлайн-демонстрация)
https://github.com/akinuri/sticky-scrollable-video (репо, подробности
уточняйте ) https://www.audi. com.tr/tr/web/tr/modeller/a8/a8-l.html (липкое видео с
прокруткой ) codepen.io/ollieRogers/pen/lfeLc (видео с прокруткой)
Онлайн-демонстрация воспроизводит плавное / поисковое видео (от Audi). Чтобы увидеть разницу между видео, вам нужно скачать проект с GitHub. Два видео (Audi и Chrome_ImF.ogv) плавно / доступны для поиска. Два других (Chrome_icon, bedroom.mp4) проблематичны / лаги (доступны только несколько кадров).
Chrome / Opera обеспечивает более плавное воспроизведение, чем Firefox. Я использую Premiere Pro для видео.
Изменить: хотя связанный вопрос говорит об одной и той же проблеме, я не могу отметить свой вопрос как его дубликат. Зачем? Ему 3 года, есть только один ответ, ответ не принят, и он плохой. Монтаж видео - не мое основное занятие, поэтому я не могу сделать прямых выводов из ответа. Ответы следует давать подробно. Мои вопросы и ответы более подробно. Поэтому я сомневаюсь, что кто-то, просматривающий оба вопроса, предпочел бы старый.
Проблема действительно в возможности поиска. Я нашел еще один вопрос, связанный с этой проблемой, и это заставило меня немного глубже изучить ключевые кадры.
Я искал способ изменить ключевые кадры (в Premiere Pro) и нашел его в
Export Settings (CTRL+M) -> Video -> Advanced Settings -> Key Frame Distance
Расстояние между ключевыми кадрами - это максимальное количество кадров до того, как кодировщик вставит i-кадр, ...
https://forums.adobe.com/message/9451877#9451877
Этот параметр не отмечен галочкой и установлен на 72. Таким образом, в зависимости от FPS он составляет 1-2 секунды. Чтобы сделать поиск по всем кадрам, я установил это значение, 1и это сработало.
Обновление: оказалось, что воспроизведение видео с низким KFD на мобильных устройствах (Chrome, Samsung Internet) проблематично. Пока StickyScrollableVideoмогу воспроизвести видео (используя currentTime), тормозит. С другой стороны, video.play()не получается. Видео просто не воспроизводится. Поэтому вместо использования StickyScrollableVideoна мобильном устройстве я отключу его и просто воспроизведу видео. И для этого мне нужна версия видео с более высоким KFD. Итак, я подготовил два видео; один с KFD: 1 для настольных компьютеров / StickyScrollableVideo, а другой с KFD: 25 (FPS) для мобильных устройств / video.play().
Проблему можно увидеть здесь: https://akinuri.github.io/in-view-tracker/video.html
Первое видео с KFD: 1, а второе - KFD: 25. Нажмите на видео для воспроизведения / паузы.
Эта статья взята из Интернета, укажите источник при перепечатке.
Если есть какие-либо нарушения, пожалуйста, свяжитесь с[email protected] Удалить.
я говорю два предложения