需要使用 iFrame API 隐藏 YouTube 品牌 [英] Need to hide YouTube Branding with iFrame API

查看:30
本文介绍了需要使用 iFrame API 隐藏 YouTube 品牌的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用 YouTube iFrame API 在我的自定义播放器(javascript 播放器)中加载视频.我需要隐藏 Youtube 品牌,但在 iOS 设备上,它显示带有以下参数的徽标:

playerVars:{'fs':1,'自动播放':0,'showinfo':0,'rel' : 0,'控制':视频控制,'cc_load_policy' : 0,'白颜色','适度品牌':1,'iv_load_policy' : 3,'循环':inv_loop,'wmode': '透明','播放列表':播放列表,'在线播放':1}

如果我将showinfo"保持为 1,它会隐藏徽标,但会显示视频标题、分享和稍后观看图标以及广告.

有什么办法可以使用 iFrame API 隐藏两者(YouTube 徽标和带有广告的上传者信息)?

谢谢!

解决方案

我隐藏了除播放/暂停按钮之外的所有内容.

我设法以负边距做到了这一点.

检查下面的代码 -

<style type="text/css">#抵消{位置:绝对;顶部:-300px;底部:-300px;右:0;左:0;背景颜色:黑色;z-索引:12;}#付款人容器{高度:450px;宽度:800px;溢出:隐藏;位置:相对;z-索引:1;}</风格><头><元名称=视口"内容=宽度=设备宽度,初始规模=1.0,最大规模=1.0,用户规模=无"><script src=https://www.youtube.com/iframe_api"></script><身体><div id="payer-container"><div id="偏移量"><div id="youTubePlayerDOM"></div>

<script type="text/javascript">var 播放器;函数 onYouTubeIframeAPIReady() {player = new YT.Player('youTubePlayerDOM', {高度:'100%',宽度: '100%',玩家变量:{自动播放":0,控制":0,启用jsapi":1,video_id":QswsUQNDW_U"}});}</html>

注意:

  • 如果需要,您应该手动创建控制器.
  • 视频的纵横比是固定的.

I am using YouTube iFrame API to load videos in my custom player (javascript player). I have a requirement to hide the Youtube branding however on iOS devices, it shows the logo with below parameters:

playerVars:
{
    'fs':1,
    'autoplay' : 0,
    'showinfo' : 0,
    'rel' : 0,
    'controls' : videoControls,
    'cc_load_policy' : 0,
    'color':'white',
    'modestbranding' : 1,
    'iv_load_policy' : 3,
    'loop':inv_loop,
    'wmode': 'transparent',
    'playlist':playlist,
    'playsinline':1
}

If I keep "showinfo" to 1, it hides the logo however it shows the video title, share and watch later icons along with ads.

is there any way to hide both (youtube logo and uploader info with ads) with iFrame API?

Thanks!

解决方案

I hide everything except play/pause button.

I manage to do this with negative margins.

Check the code below -

<!DOCTYPE html>
<html>
    <style type="text/css">
        #offset{
            position: absolute;
            top: -300px;
            bottom: -300px;
            right: 0;
            left: 0;
            background-color: black;
            z-index: 12;
        }

        #payer-container{
            height: 450px;
            width: 800px;
            overflow: hidden;
            position: relative;
            z-index: 1;
        }

        
    </style>

    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <script src="https://www.youtube.com/iframe_api"></script>
    </head>

    <body>
        <div id="payer-container">
            <div id="offset">
                <div id="youTubePlayerDOM"></div>
            </div>
        </div>
    </body>

    <script type="text/javascript">
        
        var player;

        function onYouTubeIframeAPIReady() {

            
            player = new YT.Player('youTubePlayerDOM', {
                height: '100%',
                width: '100%',
                playerVars: {
                    "autoplay": 0,
                    "controls": 0,
                    "enablejsapi": 1,
                    "video_id": "QswsUQNDW_U"
                }
            });
        }

    </script>
</html>

Note:

  • You should have to create controllers manually if needed.
  • The aspect ratio of the video is fixed.

这篇关于需要使用 iFrame API 隐藏 YouTube 品牌的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
前端开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆