Responsive vimeo iframe – height on mobile

Hey Hexagongirl. Thanks so much for using featherlight!

I believe this thread will shed some light on the issue for you: https://www.ads-software.com/support/topic/video-too-small?replies=3

We’re hoping for a patch from the featherlight script to come through relatively quickly, but at the moment it’s a bit out of our control unfortunately. We’ll update our WordPress plugin as soon as the patch from Featherlight is released. Thanks again!

Hi WP Site Care, thanks for getting back to me.

Just checked out the issue on Github, the latest update is as follows:

The original author isn’t around much, I do most of the maintenance…

Which doesn’t bode too well! Do you know whether there’s any other work around? I’m using fluidvids, but this doesn’t seem to help…

Thanks

Hey Hexagongirl,

marcandre has been the active maintainer of featherlight for as long as I’ve been using it and he’s always been pretty quick about getting issues patched and pull requests merged in, so I wouldn’t worry too much about that.

I’m going to be working on getting this fixed over the holidays, so hopefully we’ll either have a patch for featherlight or a workaround within our plugin right after the new year.

As for your current issue, I’ll need to do some testing with fluidvids, but FitVids seems to work as expected. Here’s a demo of the plugin working with a responsive video alongside FitVids.

I’ll look into getting it working with fluidvids and update this thread as soon as I have more information or when we push an update which solves this problem.

Hope that helps!

Hi Robert

Thanks so much for your reply and for the demo, just back to work now after Christmas, sorry for the slow reply.

Just had a look at the demo – that kind of looks similar to how I have things working with fluidvids. But in your demo, if I resize my screen (using Chrome developer tools) so that the video cover image fills the screen (say 646px x 362px), then click to play, once the video is playing I get black horizontal bars top and bottom, and the video itself is only half visible.

Can you see what I mean?

Thanks for your help,
Sarah

and the video itself is only half visible.

Try setting overflow-y to auto for the featherlight container.

.featherlight {
	overflow-y: auto;
}