It's become apparent to me that when in Google Chrome (37), if I navigate away from a page that has multiple FitVids instances, and then use the browser's back button to return to the page, all of the frames become the same frame (even though they still contain the original markup).

There is an open Chromium bug for this: https://code.google.com/p/chromium/issues/detail?id=395791

As a temporary fix I have done the following:

$allVideos.each(function(){
    ...
    // Reload iFrame to fix Chrome bug
    $this.attr('src', $this.attr('src'));
});

I know it seems silly to have to reset the same source, but it does work. Is there a more permanent fix for this coming down the line, or are we going to hold out until Google fixes the issue with Chrome? It's been there since at least v34 and is still on v37.

Someone posted a comment on my blog. My IE9 test environment is totally bjorked so I can't confirm or deny.

Causes bizarre errors for me in IE9 when using youtube's iframe embeds (though it really looks like a problem with their code, not fitvids directly). Claims "Math is not defined." May have something to do with the floating point dimensions and YT's iframe resize code.

Here's a fiddle:
http://jsfiddle.net/YnFsn/

Looking into it, but you may have more insight. Works like a charm with all other browsers: brilliant stuff.

Love this!

Any chance of getting it to work with http://socialcam.com/?

ie.

<iframe width="520px" height="391px" src="http://socialcam.com/videos/XRMP3Y5t/embed?utm_campaign=web&utm_source=embed" frameborder="0" allowfullscreen></iframe>

Recently we started noticing an issue with FitVids where it will cause all the iFrame embeds on the page to swap out for one of the random embeds duplicating the video across the page. In testing we can reproduce this 100% of the time in the latest versions of Chrome (16.0.912.77) and Safari (5.1.2). Oddly Firefox 6 & 8 do not have the issue, but Firefox 3.6 behaves the same way.

jsFiddle - http://jsfiddle.net/nAXXY/5/ Five embeds (Vimeo and Youtube), simple CSS, jQuery 1.7.1 and latest FitVids.js

Steps to reproduce:

1. Load up http://jsfiddle.net/nAXXY/5/
2. Click on any link taking you to a new page or type in a new URL
3. Hit back on your browser
4. Refreshing the page will correct the issue

Video demo - http://cloud.jonathanmoore.com/Ddsv

On the readme it says Fitvids works with Blip.tv, but look here:

http://jsbin.com/ejazuf/1/edit

Notice the video wrapper that's supposed to be placed around the video by the script is actually appearing below the video, creating a big gap between the video and the links (which should be right under the video).

Has anyone seen this bug before? I didn't investigate it too much but I also couldn't find any issues discussing blip.tv on here.

Hi,

Have a wee problem with FitVids, where the video breaks from it's container when the orientation is changed on a Smartphone.

Preview site can be viewed here - www.contrast.firstbasedesign.co.uk

It will load up fine in Portrait. But if you switch to Landscape mode, then back to portrait, the video keeps the dimensions from Landscape mode??

Hmmm

I've been trying to get fitvids to work with my kaltura player ( http://kaltura.org ) but just can't seem to get it to work.

Here is a 'temp' video embed code to test:

https://gist.github.com/2325974

I tried to paste in the embed code here, but it just doesn't work, hence the gist.

Basically I have to modify the fitvids.js script to force a fixed height, which of course breaks the entire concept of fitvids.

Is there an easy fix for this?

Hi davatron,

Firstly, thanks for the awesome jQuery plugin. It really is a great asset to have in one's library.

We've implemented FitVids.js in addition to a featured slider, namely FlexSlider ( http://flex.madebymufffin.com/ ). Upon doing so, we noted that FitVids.js had issues retrieving the width and height information for Vimeo videos embedded with an iFrame. We modified our script to force a width and height attribute for this iframe, with the result that a black poster frame displays for the video, but no video controls display on hover of this video.

Hoping this is a known issue that can be resolved.

Thanks again for the great plugin. :)

Thanks and regards, Matty.

OH HAI. I'm using the following configurations :

• Windows 7 SP1 64 bits + Firefox 13.0.1 + Flash 11.3.300.257
• Windows Vista (sorry) Pro 32 bits + Firefox 13.0.1 + Flash 11.3.300.257

On the first one, the window can't be resized (so the video can't too). It works well on the other one.

Weird thing 1 : maximazing the window resizes the video ! Weird thing 2 : the video adapts to the original window size, but resizing isn't allowed once it is loaded.

Any idea ?

Thanks !

Fitvids rocks!

I'm using the fitvids wordpress plugin. The most recent version of the plugin and of wordpress.

When viewing my site in mobile safari, and loading the page in portrait view, I'm finding that vimeo embeds do not properly resize. They exceed the width of the content area. Youtube seems to be working fine. Here's a screenshot comparing youtube and vimeo:

Here's the live page: http://www.vtbarfoundation.org/news/fitvids-test

Everything works fine on a desktop browser, it just seems to be an issue with mobile safari.

I realize you request reduced test cases for troubleshooting, but I wasn't sure how to do that in this case as it may be an issue with the plugin itself. Best I could think to do was to create a specific post containing embeds from both youtube and vimeo.

Thanks in advance for any help, and for all your great work!

I'm having an issue with absolute positioning. It looks like the video object inside my fluid-width-video-wrapper is being positioned absolutely, but the wrapper isn't getting any type of dimensions applied to it which is causing my video to cover the content that comes after it.

Could it be related to the fact that the page contains user generated content, and the user submitted a YouTube embed with height and width attributes on it?

I'm seeing this in Safari 5.2 and 5.1. Are there any known fixes for this?

Hi Folks, When I try to use this library with react + typescipt then below error comes : Property 'fitVids' does not exist on type 'JQuery'

Any guesses what could be the reason ? I think of types may be. Please guide.

Apparently the script doesn't work when using the YouTube short URL format, which use the youtu.be domain name instead of youtube.com.

I haven't tested extensively, but as far as I can tell, simply adding this domain in the script (line 37) does the trick:

return this.each(function(){
  var selectors = [
    'iframe[src*="player.vimeo.com"]',
    'iframe[src*="youtu.be"]',
    'iframe[src*="youtube.com"]',
    'iframe[src*="youtube-nocookie.com"]',
    'iframe[src*="kickstarter.com"][src*="video.html"]',
    'object',
    'embed'
  ];

Please kindly add a license to your code. We are not able to use your code in our open-source project because it does not have a license. Your help will be much appreciated.

Hi,

I'm having some issues with Fitvids.

1. I kept calling it fitbit for some reasons.
2. I'm currently running a wordpress theme (Caos), which implements AJAX calls through REST API , and Fitvids won't run unless I disable that AJAX call.

Is there a way to call Fitvids after the contents been loaded?

https://codepen.io/johnnyquest/pen/KKpQYLp

Related pull request: https://github.com/davatron5000/FitVids.js/pull/245

Has any progress been made on this?

As an aside, comment block at the top of the main js file is tagged as 1.1 rather than 1.2. Causes a little confusion.