jquery - Using Modernizr to Detect Max-Width on Inline Elements -


the reason (sorry, i'm wordy, know)

this might tricky, or unusual request on website manage have lot of pages containing images stored inside table. users put image there captions or make sure layout expect. of users not savvy enough use div's tables never going go away.

i'm working on making site responsive 1 of issues i've encountered these images browsers behave differently when image in table , viewport resized. firefox, example, not scale image using max width 100% if nested in table. according previous question, partly because there no specification how handle image when nested in inline element.

the way i've found fix problem pull out image's width/height img tag , set width 100% in css. in place firefox consistently scales down images if in table cells. here's example of type of thing i'm trying fix. drupal/ckeditor put image's width in style tag , need css/js stuff fix it.

the question

i want css/js fix apply browsers don't support max width within inline elements. there way test in modernizr? in current iteration of site's js, i'm doing browser check modernizr see if user using firefox , applying fix if detected. curious, how i'm doing (source firefox check).

modernizr.addtest('firefox', function () {  return !!navigator.useragent.match(/firefox/i); });  jquery('.firefox #zone-content img').each(function(){     jquery(this).removeattr('width');     jquery(this).css('width', ''); }); 

i'm hoping there simple way rewrite don't have use browser detection understanding of modernizr addtest api limited. else has created similar , can share knowledge.


Comments

Popular posts from this blog

linux - xterm copying to CLIPBOARD using copy-selection causes automatic updating of CLIPBOARD upon mouse selection -

c++ - qgraphicsview horizontal scrolling always has a vertical delta -