Stack Overflow
Stack Overflow

Questions tagged [fitvids]

A lightweight, easy-to-use jQuery plugin for fluid width video embeds.

A lightweight, easy-to-use jQuery plugin for fluid width video embeds. FitVids automates the Intrinsic Ratio Method by Thierry Koblentz to achieve fluid width videos in your responsive web design. It currently supports YouTube, Vimeo, Blip.tv, and Viddler.

15 questions
11
votes
1 answer

wrapping a youtube video in a static image "frame" and maintain responsive resizing

I have the below image of a blank Macbook. The image is 1034 × 543. I want inset a youtube video inside of the "grey" area of the screen. I want it to appear as if the youtube video is playing on the laptop screen. I also want the laptop image /…
tdc
  • 5,174
  • 12
  • 53
  • 102
3
votes
0 answers

jQuery Fitvids not working in Wordpress post pages

I'm using fitvids (http://fitvidsjs.com/) to make my videos responsive in Wordpress, and so far it's been fairly simple. I have a video on my home page, and the video resizes correctly there, but for some reason fitvids is not working on the post…
LNA
  • 1,427
  • 3
  • 24
  • 37
2
votes
0 answers

Force module to parse dom on filter return

I have a filter returning an youtube embed that has a wrapper linked to a module. My issue is on filter return the module never gets applied to the returned html, wondering how I can force it to watch/recompile. Filter: angular .module(…
Christopher Marshall
  • 10,678
  • 10
  • 55
  • 94
2
votes
1 answer

simple use of fitVids not working?

I'm trying to get fitvids to resize my video to fill the parent area as much as it can. Here's my fiddle: http://jsfiddle.net/LkqTU/9513/ code: $(".video-content").fitVids(); html:
…
RobVious
  • 12,685
  • 25
  • 99
  • 181
2
votes
3 answers

Is there any way to remove fitVids() from an element after it's been applied?

I am using FitVids for reponsive video. I instantiate it like this: $("#thing-with-videos").fitVids(); I want fitVids() to be applied to one particular element at screen sizes below 480px and I have implemented that. However for display purposes…
byronyasgur
  • 4,627
  • 13
  • 52
  • 96
1
vote
1 answer

fitVids() on bootstrap collapsed div - little bug opening multiple videos on single iframe

It's strange that such a well-known plugin comes with this issue. I fought for hours against it, and finally won. I think this post will be much appreciated by anyone who will fall into the same issue. Suppose I have Twitter-Bootstrap (or another…
user3413354
  • 1
  • 2
1
vote
1 answer

Initializing FitVids plugin on Fancybox modal content

I'm trying to initialize the FitVids plugin on Fancybox modal content once that content is loaded. It works perfectly if I use the onUpdate callback for when the user resizes the viewport, but if I try to get it working with afterShow to apply it…
htmlbot
  • 81
  • 8
1
vote
1 answer

HTML5 video not playing in a bxSlider slideshow on iOS (possibly caused by fitvids.js)

When I place video into a slide on bxSlider, it plays as it should on desktop browsers, but when tested on iOS devices - iPhone and iPad, video will not play. I've included the current html code. I have duplicated the
Fisu
  • 3,294
  • 9
  • 39
  • 61
0
votes
0 answers

fitvids is adding padding-top to youtube video as inline important

I'm using a youtube embed plugin via wordpress to insert youtube videos. They work fine on some pages, but in of my widget areas the plugin adds an inline element of padding-top: 50% to the div with a class of 'fluid-width-video-wrapper', which…
Chris Shaugh
  • 185
  • 1
  • 1
  • 10
0
votes
1 answer

Prevent page from moving to top after clicking on overlay image to start video

I have a bit of code that automatically starts a video after clicking on an overlay image. The trouble is that the after clicking, the entire page moves up to the top while video plays further down the page. What is the cause and how can I prevent…
NewbCake
  • 433
  • 2
  • 7
  • 22
0
votes
1 answer

Using FitVids JQuery Plugin in Anglular 2 Component

I want to use FitVids JQuery Plugin in Angular 2 Component. I tried to add fitVids function in JQuery interface in jquery.d.ts file but I get error. I'm using typescript. Thank you all! I used this jquery.d.ts file found on GitHub. I modified it…
Samuele
  • 251
  • 2
  • 9
0
votes
1 answer

responsive tumblr video doesn’t work on mobile

In a tumblr theme I’m developing I use fitvids.js to make videos responsive. All the common embeds (YouTube, Vimeo etc.) work like a charm. I edited FitVids.js to support Tumblr video uploads (the tumblr video player). It’s behaving correctly on…
Flax
  • 72
  • 1
  • 9
0
votes
0 answers

jQuery FitVids, Tabs with mirror - YouTube disappears

I'm trying to make a tab layout for different video mirrors. Basically what I'm doing is a page with the main tab "Mirror 1" and a second one "Mirror 2". The purpose is to make the video as big as possible inside the Tabs container using…
Hyugo
  • 5
  • 1
0
votes
4 answers

Prevent fitVids from englarging videos

I have fitVids working on my site. However, I'm wondering if it is possible to prevent fitVids from enlarging a video beyond its defined height/width. For example, if a video is 600px wide, but the container is 800px, fitVids enlarges the video to…
helgatheviking
  • 25,596
  • 11
  • 95
  • 152
0
votes
2 answers

Vimeo embeded video fails to play on Android?

When I embed 100 Riffs (A Brief History of Rock N' Roll) in a Twitter Bootstrap container with FitVids.js for responsive resizing:
Sean W.
  • 4,944
  • 8
  • 40
  • 66