Видео галерея
Здравствуйте, пишу программу для видео галереи.
Суть программы... Есть миниатюры с постерами, постеры подтягиваются с ютуба, и один большой блок с видео, при клике на миниатюру, берется ссылка и передается большому блоку с видео. Проблема в том что работает только одна ссылка с миниатюр, остальные выдают (ВИДЕО НЕДОСТУПНО), в чем может быть причина? Код ниже, для большей ясности. <div class="video-gallery"> <div class="video-gallery__zoom"> <iframe class='video-gallery__video' src="https://www.youtube.com/embed/LgOPBbBUpUo" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> <div class="video-gallery__container"> <div class="video-gallery__item"> <span class="yotube-link">https://youtu.be/LgOPBbBUpUo</span> </div> <div class="video-gallery__item"> <span class="yotube-link">https://youtu.be/1Zr-AjDdfrM</span> </div> <div class="video-gallery__item"> <span class="yotube-link">https://youtu.be/rJgg00ic1G8</span> </div> <div class="video-gallery__item"> <span class="yotube-link">https://youtu.be/cSQmhBjjb1I</span> </div> </div> </div> .video-gallery display: flex .video-gallery__zoom background-color: #000 width: 50% margin: 10px .video-gallery__container width: 50% .video-gallery__item margin: 10px display: inline-block width: 46% height: 170px background-size: cover background-repeat: no-repeat .video-gallery__video, .video-gallery__video-item width: 100% height: 100% .yotube-link display: none "use strict"; $(function() { $(".video-gallery__item").each(function() { // получаем ссылку var linkYoutube = $(this).find('.yotube-link').text(); // достаем id видео var youtubeId = linkYoutube.slice(-11); console.log(youtubeId); // YouTube миниатюра получаем по id $(this).css('background-image', 'url(http://i.ytimg.com/vi/' + youtubeId + '/hqdefault.jpg)'); // Добавляем иконку Play поверх миниатюры, чтобы было похоже на видеоплейер $(this).append($('<div/>', {'class': 'play'})); $(this).click(function(){ var iframeSrc = $('.video-gallery__video').attr('src', 'https://www.youtube.com/embed/' + youtubeId + '?autoplay=1&autohide=1'); console.log(iframeSrc) }); }); }); |
Судя по всему проблема связана с авторскими правами, так как некоторые видео работают без проблем.
Возможно есть другая причина данной проблемы? |
Часовой пояс GMT +3, время: 09:10. |