PATH:
var
/
www
/
vhosts
/
lahuertaatomica.es
/
httpdocs
/
assets
/
plugins
/
fitvidsjs
/
Editing: tests.html
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Fluid Width Videos with Fitvids.js</title> <style> body { background: #ddd; } video { max-width: 100%; height: auto; } iframe, embed, object { max-width: 100%; } .container { width: 70%; padding: 5%; margin:0px auto; background:#fff; box-shadow: 0 5px 5px rgba(0, 0, 0, 0.5); } .vendor { padding: 2%; background: #d1eed1; margin-bottom: 2em; } .unsupported { background: #fddfde; } </style> </head> <body> <div class="container"> <div class="vendor"> <iframe width="425" height="349" src="http://www.youtube.com/embed/FKWwdQu6_ok" frameborder="0" allowfullscreen></iframe> </div> <div class="vendor"> <iframe src="http://player.vimeo.com/video/25708134?title=0&byline=0&portrait=0" width="400" height="225" frameborder="0"></iframe> </div> <div class="vendor"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="437" height="288" id="viddler"><param name="movie" value="http://www.viddler.com/player/d6c37b62/" /><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="true" /><param name="flashvars" value="fake=1"/><embed src="http://www.viddler.com/player/d6c37b62/" width="437" height="288" type="application/x-shockwave-flash" allowScriptAccess="always" allowFullScreen="true" flashvars="fake=1" name="viddler" ></embed></object> </div> <div class="vendor"> <embed src="http://blip.tv/play/AYHCnikC" type="application/x-shockwave-flash" width="550" height="396" wmode="transparent" allowscriptaccess="always" allowfullscreen="true" ></embed> </div> <div class="vendor"> <iframe frameborder="0" height="410px" src="http://www.kickstarter.com/projects/30453381/the-shape-of-design/widget/video.html" width="480px"></iframe> </div> <div class="vendor"> <iframe frameborder="0" height="380" src="http://www.kickstarter.com/projects/150422311/screencasting-a-complete-redesign/widget/card.html" width="220"></iframe> </div> <p>^^ The above kickstarter widget should fail.</p> <div class="vendor"> <iframe width="520px" height="391px" src="http://socialcam.com/videos/XRMP3Y5t/embed?utm_campaign=web&utm_source=embed" frameborder="0" allowfullscreen></iframe> </div> <div class="vendor"> <iframe class="fitvidsignore" src="http://player.vimeo.com/video/28523422?title=0&byline=0&portrait=0&color=4584be" width="800/embed/?moog_width=800" height="450" frameborder="0"></iframe> </div> <p>^^ The above vimeo embed should fail. It has a class of 'fitvidsignore'. </div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="jquery.fitvids.js"></script> <script> // Basic FitVids Test $(".container").fitVids(); // Custom selector and No-Double-Wrapping Prevention Test $(".container").fitVids({ customSelector: "iframe[src^='http://socialcam.com']"}); </script> </body> </html>
SAVE
CANCEL