megauser Опубликовано 10 ноября, 2019 Жалоба Поделиться Опубликовано 10 ноября, 2019 Есть сайт https://russia.feeriya.ru/catalog/batarei_saljutov_krupnye На нем присутствует при наведении иконка видео( а если на нее навести, то включается видео) , подскажите как тут реализовано? нужно точь такое же. Видео файлом к товару прикрепил, и могу вывести его в тег видео. Но я так думаю что надо чтоб при наведении он аяксом подгружался? натолкните на мысль, спасибо. Цитата Ссылка на сообщение Поделиться на другие сайты
shooroop Опубликовано 11 ноября, 2019 Жалоба Поделиться Опубликовано 11 ноября, 2019 обыкновенный jq событие при наведение мышкой mouseover function() { var video_parent = $(this).parent().parent().find('.product-block__video-wrapper'), video_block = video_parent.find('.product-block__video'), video_id = video_block.attr('data-video'); if (video_block.length && video_id.length) { video_block.empty(); video_parent.addClass('active'); var video = $('<video allow="autoplay"></video>'), video_wrapper = $("<div id='player_catalog_grid'/>"); $(["mp4"]).each(function(i, type) { video.append($("<source/>").attr({ src: "https://data.feeriya.ru/video/" + video_id + "." + type, type: "video/" + type })); }); video_block.append(video_wrapper); video_wrapper.append(video); video_wrapper.flowplayer({ key: '$303743110049035', ratio: 9 / 16, volume: 1 }).one('ready', function(ev, api) { api.play(); api.volume(1); }); } } Цитата Ссылка на сообщение Поделиться на другие сайты
megauser Опубликовано 11 ноября, 2019 Автор Жалоба Поделиться Опубликовано 11 ноября, 2019 обыкновенный jq событие при наведение мышкой mouseover function() { var video_parent = $(this).parent().parent().find('.product-block__video-wrapper'), video_block = video_parent.find('.product-block__video'), video_id = video_block.attr('data-video'); if (video_block.length && video_id.length) { video_block.empty(); video_parent.addClass('active'); var video = $('<video allow="autoplay"></video>'), video_wrapper = $("<div id='player_catalog_grid'/>"); $(["mp4"]).each(function(i, type) { video.append($("<source/>").attr({ src: "https://data.feeriya.ru/video/" + video_id + "." + type, type: "video/" + type })); }); video_block.append(video_wrapper); video_wrapper.append(video); video_wrapper.flowplayer({ key: '$303743110049035', ratio: 9 / 16, volume: 1 }).one('ready', function(ev, api) { api.play(); api.volume(1); }); } } <div class="product-block__video-btn" data-video-file="{$product->id}" data-video="{$product->id}">VIDEO</div> <div class="product-block__video-wrapper"> <div class="product-block__video" data-video="{$product->id}"></div> </div> Добавил блок на который наводить и блок обложки куда будет подгружаться видео. $(".product-block__video-btn").on("mouseover", function(){ var video_parent = $(this).parent().parent().find('.product-block__video-wrapper'), video_block = video_parent.find('.product-block__video'), video_id = video_block.attr('data-video'); video_block.empty(); video_parent.addClass('active'); var video = $('<video allow="autoplay"></video>'), video_wrapper = $("<div id='player_catalog_grid'/>"); $(["mp4"]).each(function(i, type) { video.append($("<source/>").attr({ src: "https://site.ru/video/" + video_id + "." + type, type: "video/" + type })); }); video_block.append(video_wrapper); video_wrapper.append(video); video_wrapper.flowplayer({ key: '$303743110049035', ratio: 9 / 16, volume: 1 }).one('ready', function(ev, api) { api.play(); api.volume(1); }); }); flowplayer подключил, думаю с ним после разобраться, при наведении js не срабатывает , где ошибся? Цитата Ссылка на сообщение Поделиться на другие сайты
megauser Опубликовано 2 декабря, 2020 Автор Жалоба Поделиться Опубликовано 2 декабря, 2020 Тема по прежнему актуальная, стоит прикрепление файла от ps-simpla. То есть только один файл прикрепляется. Требуется аяксом при наведении на угол товара чтоб аяксом подгружалось видео и воспроизводилось. Аналогично с сайтом https://www.feeriya.ru/ Цитата Ссылка на сообщение Поделиться на другие сайты
shooroop Опубликовано 3 декабря, 2020 Жалоба Поделиться Опубликовано 3 декабря, 2020 ну вроде я все ясно расписал, если не получается пиши сделаю за $ Цитата Ссылка на сообщение Поделиться на другие сайты
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.