Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Общие вопросы по вёрстке » Как реализовать видео превью в короткой новости?

Как реализовать видео превью в короткой новости?


     05.08.2020    Все вопросы » Общие вопросы по вёрстке    167

вопрос
Всем доброго времени, кто читает!
Как реализовать в DLE в shortstory, чтобы при наведении мышки, проигрывалось видео-превью как в адалт тубах, но при этом не загружалось для посетителя до тех пор, пока он не наведет мышку?
Превью загружаю на свой сервер.

Ответа пока нет


8 комментариев

souz21
Юзер

souz21 - 5 августа 2020 14:12 -

В сети есть такой вариант, но нету автоповтора, и в мобильниках не работает.

<video id="myVideo">
<source src="/yourSource/vid.mp4" type="video/mp4"/>
</video>


<script>
var vid = document.getElementById("myVideo");
vid.onmouseover = function(){
vid.play();
}
vid.onmouseup = function(){
vid.stop();
}
</script>

TeraMoune
Эксперт

TeraMoune - 5 августа 2020 20:46 -

Делать короткие тубы нужных размеров и без звука, как на адал сайтах и ютубе и везде где такое сделано. Это не делается из основного видео. При загрузке скрипт делает небольшой файлик, где-то местами он берёт по паре секунд и потом собирает целый секунд 5-10 короткий фрагмент состоящий из нескольких кусочков.

Автоповторы делаются установкой параметра loop видео.

souz21
Юзер

souz21 - 5 августа 2020 21:54 -

TeraMoune, но в итоге получается mp4 файл, который активируется при наведении мышки на компе, или в середине экрана на смартфонах. Посмотри на браззерс. Там активируется полноценный файл, который можно даже скачать. Я не про то, как сделать превью из видео, а как реализовать показ этого превью уже из имеющегося файла-превью? Пример выше рабочий. Но этому коду много лет уже. На том же браззерс, превью срабатывает сразу, как только оно оказывается в середине дисплея смарта. А в этом коде только на компе работает, с курсором мышки

TeraMoune
Эксперт

TeraMoune - 6 августа 2020 01:10 -

Ну выходит заголовок не совсем хороший.

Выводи видео в коротких новостях указывая в каждом пути к файлам (но это думаю и так понятно)

Коду не важно сколько лет, принципы работы не изменялись. При наведении курсора, запустить видео, при этом, чтобы видео повторялось пока играет у него должен быть выставлен аттрибут loop, это либо сделать в разметке шаблона html тегом либо выставить js функцией в момент наведения.

У меня так-то тоже так и работает.

Про автоматическое проигрывания видео тут уже ищите код или плагины для отслеживания элемента и определения того является ли оно в видимой области. По аналогии как работает плагин отложенной загрузки.

dj-avtosh
PHP-developer

dj-avtosh - 6 августа 2020 10:25 -

ffmpeg в помощь

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.): @blob42
В телегу писать сразу задачу и бюджет.

souz21
Юзер

souz21 - 7 августа 2020 08:32 -

dj-avtosh, к чему это? Здесь нужна реализация на java и css

dj-avtosh
PHP-developer

dj-avtosh - 7 августа 2020 08:41 -

java?)

ЯД: 41001679231462
Заказы в telegram (ремонт модулей, оптимизация нагрузок и т.п.): @blob42
В телегу писать сразу задачу и бюджет.

souz21
Юзер

souz21 - 8 августа 2020 11:52 -

dj-avtosh, Я не спрашиваю, как сделать из видео короткое превью? А как реализовать показ уже готового превью?!

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх