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

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

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

вопрос
Всем доброго времени, кто читает!
Как реализовать в 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 видео.
Тестовый репозиторий установки плагинов: teramoune
souz21
Юзер

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

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

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

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

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

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

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

Про автоматическое проигрывания видео тут уже ищите код или плагины для отслеживания элемента и определения того является ли оно в видимой области. По аналогии как работает плагин отложенной загрузки.
Тестовый репозиторий установки плагинов: teramoune
dj-avtosh
PHP-developer

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

ffmpeg в помощь
По заказам пишем сюда: @Rud00y

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

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

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

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

java?)
По заказам пишем сюда: @Rud00y

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

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

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

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

 16.11.2011 MasterDmx  Общие вопросы по вёрстке, Модули
 26.08.2013 Vitos  Общие вопросы по вёрстке
 08.01.2015 vadim_g  Общие вопросы по вёрстке, Общие вопросы по PHP, Хаки
 17.09.2015 Andreychik32  Общие вопросы по вёрстке, Шаблоны (TPL), Стили (CSS)
 16.11.2015 gothtaxi  Общие вопросы по вёрстке
 29.12.2015 sa22-91  Общие вопросы по вёрстке, Шаблоны (TPL), Стили (CSS), Ламерские вопросы
 11.04.2016 ZeN41k  Общие вопросы по вёрстке, Шаблоны (TPL), Стили (CSS), Общие вопросы по PHP
 30.09.2016 Binnatli  Общие вопросы по вёрстке
 08.05.2017 mewow  Общие вопросы по вёрстке, Ламерские вопросы
 21.10.2017 ElhuroN  Общие вопросы по вёрстке
  • Shandi | Почему не отображается картинка в галере ... 2
    Фото Shandi
    Shandi
    Почему не отображается картинка в галерее?
    Сегодня, 08:53
    Мне как ламеру ничего не понятно:( Кто-то это исправляет за денужку?
  • TeraMoune | Как сделать водяной знак с заменой? 1
    Фото TeraMoune
    TeraMoune
    Как сделать водяной знак с заменой?
    Вчера, 23:29
    Картинки загружаются в разные директории в зависимости от длительного периода загрузок этих папок может быть десятки. Более того оригинальные изображения не всегда имеют безопасные имена и при загрузке часто переименовываются. Так что не факт, что оригиналы соответствуют загруженным копиям.
  • TeraMoune | Почему не отображается картинка в галере ... 2
    Фото TeraMoune
    TeraMoune
    Почему не отображается картинка в галерее?
    Вчера, 23:19
    Потому что какой-то стиль может скрывает изображение. Проинспектируйте элемент, отыщите в древо html изображение и указав на него указатель в инспекторе кода посмотрите не наследуются ли какие-то посторонние стили.
  • Beton1205 | Как реализовать шифрование трафика? 4
    Фото Beton1205
    Beton1205
    Как реализовать шифрование трафика?
    Вчера, 17:55
    Делается очень просто. Грузим файлы на cdn, либо друглй сервак.
    На сайте пишем простой скрипт, который будет получать реальные адреса, например адрес файла site.ru/video.mp4, скрипт долюен проверять, что с вашего адреса идет звпрос. И тупо скриптом выводим ссылку аля vashsite.site/video.mp4 и прокидукм ее mod rewrite
  • mondolfo | Как вывесит в comments.tpl картинку с но ... 7
    Фото mondolfo
    mondolfo
    Как вывесит в comments.tpl картинку с новости?
    23-11-2024, 23:42
    кто-нибудь решил эту?
  • Darkzone | Выбор категории для доп. поля? 4
    Фото Darkzone
    Darkzone
    Выбор категории для доп. поля?
    22-11-2024, 17:08
    Разъясните как вытащить id?
  • lutskboy | Вытащить все данные из определенного доп ... 1
    Фото lutskboy
    lutskboy
    Вытащить все данные из определенного доп поля?
    22-11-2024, 16:17
    в adminer можно.
  • lutskboy | Выбор категории для доп. поля? 4
    Фото lutskboy
    lutskboy
    Выбор категории для доп. поля?
    22-11-2024, 16:14
    выбрать все кроме такого нет. можно с бд достать все ид через запятую и вставить в xfields.txt
    js скрипт можно написать
    
<script>
    window.addEventListener('load', ()=> {
        $('#category').on('change', function() {
            var value = $(this).val();
            if ($.isArray(value)) {
            	ShowOrHideEx("xfield_holder_year", jQuery.inArray('1', value) != -1 || jQuery.inArray('2', value) != -1 );
            } else {
            	ShowOrHideEx("xfield_holder_year", value == 1 || value==2);
            }
        })
    });
</script>
year доп поле . 1 и 2 катег
  • Darkzone | Выбор категории для доп. поля? 4
    Фото Darkzone
    Darkzone
    Выбор категории для доп. поля?
    22-11-2024, 14:39
    Смотрите, Нужно чтоб обязательное к заполнению доп. поле при добавлении новости, выводилось во всех категориях, кроме двух. Так как количество категорий довольно большое, есть ли способ, не тыкать каждую категорию в которой будет отображаться доп.поле. Надеюсь я смог разъяснить.
  • lutskboy | Выбор категории для доп. поля? 4
    Фото lutskboy
    lutskboy
    Выбор категории для доп. поля?
    22-11-2024, 13:52
    где выводить? админка или сайт
наверх