Incorrect responsive behaviour when displaying a video

[Freddixx]

Hi,

I don't know if this is a bug or if I misread the documentation somehow. I've been using featherlight a lot lately but this is a real headscratcher for me:

I'm dynamically adding a video to the lightbox using videojs. And the problem is that featherlight's scaling behaviour is a little odd, unless I add a hidden text (a h1 in this case). This looks strange to me. I prepared a fiddle to illustrate the problem:

http://jsfiddle.net/freddixx/oh313bcv/5/

The lightbox scales nicely if you comment in the line:

//playerContainer.appendChild(p);

I'd appreciate any help. I'm sure this is a simple thing once I know what's wrong here..

[marcandre]

Not too sure. Is this what you'd like?

[mrmwiebe]

Yep, I'm having issues when using data-featherlight='iframe'. The Lightbox opens up and you can see the video in a tiny square in the center of the screen. I would really like it to scale up to fill the screen no matter the size and I've been poking at the code for a while now and can't figure out a good solution.

[flywebguy]

bump

[mfurlend]

+1

[robneu]

This is another duplicate of #188

Or I guess it is a duplicate of this, since it's older. Either way, same issue.

[CSobol]

This is still occurring. Youtube videos seem to want to load at 300px wide.

[dbworth]

I also found that the default size of a video in an iFrame is 300 x 150.
In PR #353 I added some example code to the Readme that shows how to stretch a video to fill the window.