YouTube встраивать showinfo устарела

Question

Мы используем видео YouTube на нашем сайте в качестве баннера героя.

Однако несколько дней назад он начал показывать свой заголовок, кнопку просмотра позже и кнопку обмена.Мы смогли скрыть их, используя &showinfo=0 в конце, если URL.

Я обнаружил, что showinfo устарел и, таким образом, вы больше не можете скрывать тот факт, что онтам есть видео на YouTube.

Есть ли другой параметр, который мог бы сделать то же самое?

Вы не можете сделать это с CSS или JavaScript , как естьiframe.

Любые идеи очень ценятся.

ОБНОВЛЕНИЕ:

Любой слой или маска поверх видео не помогают, так какинформация отображается, когда видео загружается, или если вы щелкаете за пределами браузера, видео приостанавливается, и информация отображается.

Скрытие верхней части ~ 60px работает, но это не хорошее решение для меня.

Answer 1

Будьте осторожны, перевод документов (я проверяю только на французский) не актуален.

Answer 2

<div id="schnitt">

<iframe width="500" height="280" src="https://www.youtube.com/embed/rlR4PJn8b8I?controls=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

</div>

<style>
#schnitt {
height:250px;
overflow:hidden;
}

iframe {
margin-top:-55px;
}
   </style>

Answer 3

Как насчет этого.Да, это увеличит видео.

iframe {
  transform:scale(1.4);
}

Answer 4

Если вам нужно скрыть информацию, в идеале перейдите на Vimeo pro (который правильно поддерживает встраивание без информации),

В противном случае существует простой обходной путь:

https://jsfiddle.net/10ov5hgw/1/

Он обрезает нижний и верхний 60-пиксельный кадр iframe, но через переполнение, а не черную полосу сверху, поэтому видео все равно выглядит полноэкранным все время (и практически любое видео обрезается, если принудительно выполнить 720),

Этот хак поддерживает необходимость поддержки мобильных представлений, не оказывая сильного влияния на видимую область видео.

.video-container{
  width:100vw;
  height:100vh;
  overflow:hidden;
  position:relative;
}
.video-container iframe,{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video-container iframe, {
  pointer-events: none;
}
.video-container iframe{
  position: absolute;
  top: -60px;
  left: 0;
  width: 100%;
  height: calc(100% + 120px);
}
.video-foreground{
  pointer-events:none;
}

<div class="video-container" >
    <div class="video-foreground">
        <iframe
               src="https://www.youtube.com/embed/W0LHTWG-UmQ?controls=0&showinfo=0&rel=0&autoplay=1&loop=1&playlist=W0LHTWG-UmQ&mute=1"
               frameBorder="0" allowFullScreen>

        </iframe>
    </div>             
</div>                                        

Answer 5

<div id="schnitt">

<iframe width="500" height="280" src="https://www.youtube.com/embed/rlR4PJn8b8I?controls=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

</div>

<style>
#schnitt {
height:250px;
overflow:hidden;
}

iframe {
margin-top:-55px;
}

Answer 6

Отсутствие 'rel = 0' раздражает, но есть обходной путь.Если вы работаете с API IFrame (в отличие от встраивания iframe ex http://youtu.be/?videoIDxxx...), вы можете получить событие для остановки (завершения) видео, а затем вызвать видео по идентификатору в проигрывателе. См. https://developers.google.com/youtube/iframe_api_reference#Playback_controls для ссылки на основного игрока.

 
....

<div id="player1"></div>

<script type="text/javascript">
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

var player ;

function onYouTubeIframeAPIReady()
    {
    player = new YT.Player('player1', 
        { 
        videoId: 'YourVideoId',
        events: {
            'onStateChange': onPlayerStateChange
             }
        });

    }; // onYOuTubeIframeAPIReady
    		
function onPlayerStateChange(event)
    { 
    // Alt approach //if( event.data  == 0){ location.reload()}
    if( event.data  == 0)
        { player.cueVideoById({videoId:'YourVideoID',
                               suggestedQuality: 'hd720'})
        };
    } 

     </script>

Answer 7

Я смотрел на ту же проблему, и единственное решение, которое я нашел, - включить автоматическое воспроизведение видео и поместить прозрачный слой поверх окна YouTube.

Пользователь не сможет взаимодействовать с плеером., но это может быть полезно в некоторых ситуациях, таких как banner.

К сожалению, кажется, что код не работает правильно в stackoverflow, я также добавляю jsfiddle: http://jsfiddle.net/z3dqpuy0/

.yt-cntainer {
  position: relative;
}
		
.yt-mask {
  position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

<div class="yt-cntainer">
  <iframe id="vid-player-1" src="https://www.youtube.com/embed/Bey4XXJAqS8?enablejsapi=1&rel=0&controls=0&showinfo=0&autoplay=1" frameborder="0"></iframe>
  <div class="yt-mask"></div>
</div>

Answer 8

Решение, которое я нашел эстетически наиболее приятным, заключается в том, чтобы наложить видео с высоким разрешением на видео и скрыть его при наведении.Это также решает проблему, связанную с тем, что предварительный просмотр YouTube имеет низкое разрешение и, на мой взгляд, выглядит дешево.

Проверьте это здесь: http://jsfiddle.net/d9D9E/1/

Пришлось написать код, чтобы показать скрипту js: /

.video-thumbnail{
    z-index:300;
    position:absolute;
    top:0;
    left:0;
    width:100%;
}

.video-thumbnail:hover{
    display:none;
}

Answer 9

Ну, я тоже это заметил.Это сосет и разрушает эстетику.Поэтому я просто набрал

header {
    /* remove when YT got its brain back */
    margin-top: -56px;
}

, надеясь, что они снова добавят showinfo=0.

Answer 10

Непосредственно из show info

Примечание. Это объявление об устаревании параметра showinfo.Кроме того, поведение параметра rel меняется.Заголовки, информация о каналах и связанные с ними видео являются важной частью работы пользователей YouTube, и эти изменения помогают обеспечить согласованность просмотра YouTube на разных платформах .

Поведение для релевантногопараметр изменяется 25 сентября 2018 года или после этой даты. В результате этого изменения вы не сможете отключить похожие видео.Однако у вас будет возможность указать, что соответствующие видео, отображаемые в проигрывателе, должны быть с того же канала, что и только что воспроизведенное видео.

В нем четко указано, что это то, что они считаютбыть частью опыта Cor YouTube.Не предлагается обходной путь или новый параметр, который можно отправить для архивации старых результатов.Они удаляют это.Если бы вы попытались заставить его использовать javascript и css, я бы почти предположил, что вы против TOC, где указано, что вы не имеете права изменять это отображение.Люди должны знать, что вы показываете что-то с YouTube