an iframe responsive very light jQuery plugin
//bower
bower install --save yohoho.flexy
//npm
npm install yohoho.flexy
<!-- In your <body> HTML tag -->
<!-- iframe -->
<iframe width="560" height="315" src="https://www.youtube.com/embed/x3kfyZJhC3U?rel=0&showinfo=0" frameborder="0" allowfullscreen></iframe>
<!-- embed -->
<embed width="560" height="315" src="https://www.youtube.com/embed/x3kfyZJhC3U?rel=0&showinfo=0" frameborder="0" allowfullscreen></embed>
<!-- video -->
<video width="560" height="315" src="movie.ogg" autoplay poster="poster.jpg">
Sorry, your browser doesn't support embedded videos, but you can <a href="movie.ogg">download it</a> and watch it with your favorite video player!
</video>
<!-- video -->
<video width="560" height="315" controls poster="poster.jpg">
<source src="movie.mp4" type="video/mp4" />
<source src="movie.ogv" type="video/ogg" />
<source src="movie.webm" type="video/webm" />
Sorry, your browser doesn't support embedded videos
</video>
<!-- object -->
<object width="560" height="315" data="object.swf" type="application/x-shockwave-flash"></object>
//in your main JS file with default options
$('iframe').flexy();
//in your main JS file with custom options
$('iframe').flexy({
addcss: true,
classname: 'flexy-wrapper',
widescreen: false
});
Option | Type | Default | Description |
---|---|---|---|
addcss | boolean | true | Enables default flexy inline CSS applied to wrapper and video element |
classname | string | 'flexy-wrapper' | CSS class applied to wrapper |
widescreen | boolean | false | Enables wide screen format (16/9). Made especially for Vimeo embed |
jQuery latest version
Made with ♥ by Achraf Chouk
Please, read LICENSE for more details.