This is good however stretching (hoping it has a maximum point it doesn’t go above) even video above it’s natural size causes pixelation and other issues look wise. It really depends on how wide your widest is on your site though.
Does this have a maximum point being the natural largest point of the video? That to me would seem a sensible clause.
Scaling down is a good idea though. For those that do want wide-narrow and are ok about the minus points it is a good solution though. I still think go with html5 when you can don’t even use iframes but output from popular video hosting can get in the way of that ideal.
Images can be done without scripting and should if you can. A huge danger of responsive is falling for the scripting solutions when simple bulk use of modernizr and then applying media queries can work. Piling on javascripts will not be the best method of adopting responsive.
My knowledge on this subject is admittedly weak, but I don’t see how stretching would be a issue. The default theme max width is far under most of the big video hosts max embed size. Not using iframes is not a solution, unless someone can tell another way users can embed video.
I’m not sure which way I’m going to go on the images. Most likely I’ll just use a css solution.
Modernizr is a good idea in theory, but it has it’s own drawbacks. Although I have considered using the HTML5 Boilerplate for the base of a child theme. But that’s another story.
If I was designing a small website with little or no com unity I would agree with most of what you said, but with a over a million visitors a month it’s a whole other ballgame.
But like I said, I’m new to this dynamic web, so maybe there is something here I don’t fully understand.
It works great throughout BP, except with the ajax. Anyone have any ideas?
Modernizr hasn’t had any draw backs for me. What exactly is your issue with it? Just load in WordPress after jquery and works like a charm.
wp_enqueue_script("jquery");
wp_enqueue_script('modernizr', get_stylesheet_directory_uri() . '/scripts/modernizr.js', array("jquery"), '2.0');
I store a hand rolled version of modernizr in my scripts/ folder. As I use child themes I use stylesheet as roll variations depending on what site requires.
My point about the width and stretching is not what the host uses but what you embed – it can limit to the embed size and therefore stretch. But, it depends on what hosting you are using for video.
I’ve worked on both the small and large scale with responsive so know both sides of the story.
Ajax issues sounds to me like a scripting clash I’d check using firebug what is going on if I was you.
Sorry for some reason I was thinking of Dean Edwards ie7-js instead of modernizr (staring at code too long). IE7-js tends to crash the browser if run in IE compatibility mode. But I still don’t see how Modernizr would address the fluid width issue for Youtube, Vimeo, etc. If I was hosting the video myself and using the video tag I could see it working or am I missing something?
I don’t see any errors in firebug. The ajax works but it just isn’t applying the fix to the newly loaded content. This is just a guess but I think the FitVids only runs on the page-load so when new content is loaded via ajax the videos are unaffected.
I should point out for those that are not as anal-retentive as me, this simple css will also get the job done (it gives some strange aspect ratios):
`#content iframe, #content object, #content embed {
max-width: 100% !important;
}`
I’d really not recommend any !important like that as a solution it’s also not going to play well with all browsers or as you say keep the aspect ratio – so a bad solution.
I was suggesting from a media queries / html5 point to use modernizr as your shim and sub for respond.js.
How would that work with Youtube, etc?
