pupunzi / jquery.mb.YTPlayer

use a custom yutube player for a video as background on jQuery framework
https://pupunzi.com/mb.components/mb.YTPlayer/demo/demo.html
1.3k stars 431 forks source link

Cannot hide yt watermark/brand icon #381

Closed antonisgly closed 6 years ago

antonisgly commented 6 years ago

Hello!!

I am running my initilization correctly but after the video is loaded, at the bottom right side I see the ytp brand icon.

Is there any way to hide it??

pupunzi commented 6 years ago

Do you have an URL where I can see your issue?

antonisgly commented 6 years ago

hey!

You can check it here http://vaweto.eu/.

Thanks for your time!!

pupunzi commented 6 years ago

Hi, the video you're displaying is not managed by the jquery.mb.YTPlayer plug-in... Check the demo files you have in the downloaded package to see how to use it.

antonisgly commented 6 years ago

Hi, I declare data-property attribute on my .player div with the config and after that I am running on document ready state the initilization from js. Is that wrong?? Can you send me a link from the demo because I don't know which one suits to my needs.

Thanks for your time

pupunzi commented 6 years ago

Oh... ok I see, everything is right but if you set the containment as "self" the player will behave as a chromeless player (not as background) and the whole video is displayed. To make it work properly you should set a div where you declare the player property and set as containment the target div where you need the video to play. That way it will be initialized as background video.

In your case it should be:

<div id="hero-vid"></div>
<div id="bgndVideo"  data-property="{
                videoURL:'https://www.youtube.com/watch?v=PUdyuKaGQd4',
                containment:'#hero-vid',
                showControls:false,
                autoPlay:true,
                mute:true,
                loop: true,
                addRaster: true,
                stopMovieOnBlur: false,
                gaTrack: false
                }" >
</div>

And the javascript:

     var  myPlayer = jQuery("#bgndVideo").YTPlayer();

Hope this helps you.

antonisgly commented 6 years ago

Hi,

Ok! Now I understand the logic behind the plugin.. But the display sets to none.. Can I make something to prevent this?

Thanks again for your time

antonisgly commented 6 years ago

Ok, now my css rules are ok and the video size looks as I expected. But the brand icon is still there for the first two seconds of the video..

Any idea??

pupunzi commented 6 years ago

you can change the "abundance" parameter to increase the video margin to cover the logo.