Menu
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!
883
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:
110
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
