Dynamic youtube video size

frying_pan_cat · 11 Jul 2012 at 23:02

I want to embed a youtube video into my website but it looks wrong on some smaller screens since the page is in 2 columns and I want the video to be in one of them, however if the screen is too small it just overflows the side of it. Ideally I'd like it to resize when the column gets too small to hold it. I tried using the max-width attribute but it then just appears really small on all screens. Is there a way to do this and still force it to take up as much space as it can?

The site is http://eucc.org.uk if anyone wants to see what I'm talking about

Thanks

JimboTheGiant · 12 Jul 2012 at 14:16

Give this a try...

http://fitvidsjs.com/

We use this on some our responsive sites and it works a treat.

Jim

frying_pan_cat · 13 Jul 2012 at 20:41

Hey Jim, thanks for the reply. This is probably a very noobish question but where do I put the .js file? I've not done much with javascript/jquery so please excuse my ignorance

JimboTheGiant · 13 Jul 2012 at 20:56

Hi mate,

Take a look at the readme at https://github.com/davatron5000/FitVids.js

Should be pretty straight forward to follow.

Jim

frying_pan_cat · 13 Jul 2012 at 21:11

Ah, thanks. I did read it but obviously not properly, I missed the /path/to/ part of it.

Note to self: read things properly before asking stupid questions :rolleyes:

Thanks for the help, I'll try it now and report back

JimboTheGiant · 13 Jul 2012 at 21:23

Lol no problem. Let me know if it does what you wanted

frying_pan_cat · 13 Jul 2012 at 22:47

I've just tried this and it works

Exactly what I was looking for

Thanks for your help