隐藏相关视频Youtube Iframe API

问题描述 投票:4回答:2

我试图隐藏当您暂停视频时显示的相关视频但是我从类似的问题中发现,截至2018年9月25日,无法禁用相关视频显示。

更改的效果是您无法禁用相关视频。但是,您可以选择指定播放器中显示的相关视频应与刚刚播放的视频位于同一频道。

更具体:

在更改之前,如果参数的值设置为0,则播放器不会显示相关视频。更改后,如果rel参数设置为0,播放器将显示与刚刚播放的视频相同频道的相关视频。

这是JSFiddle

参数showinfo=0也不再用了,用于隐藏视频标题,观看后面的按钮和分享按钮。它已于2018年9月25日弃用,但不知何故KhanAcademy仍然可以隐藏那些包括相关视频。他们使用的是不同的API吗?

像汗学院一样隐藏相关视频或在顶部覆盖缩略图以隐藏相关视频将对我有用。

javascript youtube-iframe-api
2个回答
6
投票

所以我发现了一个开源播放器,它会隐藏所有相关视频,包括标题,共享和稍后观看按钮。

球员名字是Plyr

HTML:

<div class="plyr__video-embed" id="player">
    <iframe src="https://www.youtube.com/embed/9C1leq--_wM??origin=https://plyr.io&amp;iv_load_policy=3&amp;modestbranding=1&amp;playsinline=1&amp;showinfo=0&amp;rel=0&amp;enablejsapi=1" allowfullscreen allowtransparency allow="autoplay"></iframe>
</div>

您可以使用以下命令初始化它:

const player = new Plyr('#player', {});

// Expose player so it can be used from the console
window.player = player;

用于隐藏相关视频的CSS:

.plyr__video-embed iframe {
    top: -50%;
    height: 200%;
}

这是JSFiddle。它对我来说非常合适。


0
投票

自2018年9月25日起,youtube已更改其API。因此,您无法禁用相关视频,但可以指定可显示的列表。 https://developers.google.com/youtube/player_parameters#rel

我已经尝试了下面提供的所有可能的答案你可以在这里尝试代码:https://jsfiddle.net/ibrth/0zx7o6rs/62/https://jsfiddle.net/ibrth/z9tk1q3r/

function onYouTubeIframeAPIReady() {
    player = new YT.Player('video-placeholder', {
        width: 600,
        height: 400,
        videoId: '0sDg2h3M1RE',
        playerVars: {
            color: 'white',
            playlist: 'taJ60kskkns,FG0fTKAqZ5g',
            rel:0,
            enablejsapi:1,
            modestbranding: 1, showinfo: 0, ecver: 2
        },
        events: {
            onReady: initialize
        }
    });
}

我在这里找到了答案:

Youtube Javascript API - disable related videoshttps://webmasters.stackexchange.com/questions/102974/how-to-remove-the-related-videos-at-end-of-youtube-embedded-video

© www.soinside.com 2019 - 2024. All rights reserved.