Yohoho.flexy NPM

Flexy

an iframe responsive very light jQuery plugin

Demo page

Package manager

//bower
bower install --save yohoho.flexy

//npm
npm install yohoho.flexy

Install

<!-- In your <body> HTML tag -->

<!-- iframe -->
<iframe width="560" height="315" src="https://www.youtube.com/embed/x3kfyZJhC3U?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>

<!-- embed -->
<embed width="560" height="315" src="https://www.youtube.com/embed/x3kfyZJhC3U?rel=0&amp;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
});

Settings

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

Dependencies

jQuery latest version

Authors and Copyright

Made with ♥ by Achraf Chouk

Please, read LICENSE for more details.

flexy iframe responsive jquery-plugin ecosystem:jquery

@everything-registry/sub-chunk-3208

8 years ago

8 years ago

8 years ago

8 years ago