Thomas
Thomas

Reputation: 180

Remove Youtube Annotations from mediaelement.js Player?

I have tried adding &iv_load_policy=3 to the end of the YouTube url in multiple ways, but the annotations still show. Is there any way to edit the code so that no annotations will show?

EDIT: CODE BELOW

Files from the MediaElement.js Plugin

Random Video with Annotations: https://www.youtube.com/watch?v=IGz13x5OJ_8

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" ></script>
<script src="mediaelement-and-player.min.js"></script>
<link rel="stylesheet" href="mediaelementplayer.css" />

<script>
$(function(){
   player = new MediaElementPlayer('#video-player');
});
</script>

<video style="width:100%;height:100%;" id="video-player" preload="preload" autoplay="autoplay">
    <source type="video/youtube" src="https://www.youtube.com/watch?v=IGz13x5OJ_8" />   
</video>

Upvotes: 5

Views: 2120

Answers (2)

JFK
JFK

Reputation: 41143

The only way I found to suppress YouTube annotations is setting MEJS' YouTube plugin instead of flash (default) like :

$(function () {
    player = new MediaElementPlayer('#video-player', {
        plugins: ['youtube']
    });
});

The only inconvenience is that autoplay doesn't work (haven't found the option yet) but at least the main issue is solved ;)

See JSFIDDLE

Upvotes: 2

Etai
Etai

Reputation: 1503

The embedded player is the flash version.

According to the youtube player API, only the html5 and AS3 players support this option: https://developers.google.com/youtube/player_parameters#iv_load_policy

You can embed this through an iframe, and it will embed the html5 player and work, for example:

<iframe width="420" height="315" src="//www.youtube.com/embed/IGz13x5OJ_8?rel=0&iv_load_policy=3&autoplay=1&html5=1" frameborder="0" allowfullscreen></iframe>

The &html5=1 is only to force html5 if possible, though if the video supports it, it should use html5 by default anyway.

Upvotes: 1

Related Questions