Enhancement: Fading in the video to hide the play button and loading animation

[GoogleCodeExporter]

1.(Optional) Change the body background to be black;
2. Modify line 42 
"var tubularContainer = '<div id="tubular-container" style="overflow: hidden; 
position: fixed; top:50px; z-index: 1; width: 100%; height: 100%; opacity:0;"  
-Add opacity:0;      
3. Modify line 74.
-After "e.target.playVideo();" add...
$('#tubular-container').animate({'opacity':'100'},100000);

There may be better ways of doing this, but this method seems to work for me. 
Makes for a more elegant load.

Original issue reported on code.google.com by everythi...@gmail.com on 7 Oct 2012 at 10:07

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

I like it.  I'll work it in soon.

Original comment by seanmcca...@gmail.com on 15 Oct 2012 at 6:09

• Changed state: Accepted

[GoogleCodeExporter]

[deleted comment]

[GoogleCodeExporter]

Thank you for this nice fix. :)

Also add this property 'rel: 0' to the playerVars found at line 56. This will 
prevent showing the playlist at the end.

And to hide the play-button again, add the code below at line 81, under the 
player.seekTo function-call.
$('#tubular-container').css({'opacity':'0'});
$('#tubular-container').animate({'opacity':'100'},100000);

Original comment by m.cu...@gmail.com on 4 Apr 2013 at 1:51

[GoogleCodeExporter]

I'm still getting the play button flashing for a split-second between looping

Original comment by JacksonC...@gmail.com on 24 Jun 2014 at 3:49

[GoogleCodeExporter]

For those of you who still have this issue, take this patch and apply it to 
your checkout of the project. It will set the opacity of the player to zero and 
then back to 1 once the video starts playing.

Original comment by jix2mail on 5 Jan 2015 at 10:43

Attachments:

• jquery.tubular.1.0.js.patch

[GoogleCodeExporter]

any chance to post the whole file pls ?  Still not working for me.

Original comment by solhar...@gmail.com on 30 Jan 2015 at 11:01