Video.js: videojs player starting small and expanding

[blackflow]

I know this sound strange, but especially on slow connections whenever I setup player width to fluid (like it's explained in documentation) on page load, video player starts small and expands adding skin after video player loads.

For example on chrom with throttling set on slow 3g, when you load the videojs example it first load a small player without videojs and then it loads the skin and other stuff.

If there's only one movie on the page it's hardly noticeable but when there's more you can see skins loading- question is, if it's possible to load the movie after the skin is loaded with fluid attribute ?

[gkatsev]

This is because video.js, when not given a size for the player via attributes or CSS, will resize the player to the intrinsic size of the video when the video's metadata loads.
You can try added a load to the stylesheet and then only add the source to the player afterwards.
Another option is to use the .vjs-fill class that makes it fit its container and then make the container fluid as you would anything else.

We probably should document these things better.

[gkatsev]

Hey, did any of those suggestions end up working for you?

[blackflow]

Sorry man I thought I answered that- Yes adding ".vjs-fill" solved the problem Thx for your help. I initially did all players with fixed height since we had problems with skins and "black borders but using fluid with .vjs-fill solves all our problems.

[gkatsev]

No worries. Glad it worked!

[Rabia92]

I am also facing the same issue and above solution doesn't work for me