XF 1.2 SVGs with PNG fallback - Modernizr doesn't work

Stuart Wright

Stuart Wright

Well-known member
So the Modernizr script alters the html tag to add specific classes depending on what the browser is capable of.
So the latest Chrome would have an svg class added because it supports svg images.
But IE8 would have a no-svg class added because it can't.
And then we can use svg or png sprites depending upon which is supported like this:

Code: 
.background-class {} /* Shared properties for detected features */
.svg .background-class {background:url(styles/default/sprite.svg);} /* SVG feature property */
.no-svg .background-class {background:url(styles/default/sprite.png);} /* PNG feature property */

Except these classes aren't being added to the html tag. I don't know why and I'm flailing round in the dark a little bit.

Anyone used Modernizr who can share any tips?
Thanks
 
Sort by date Sort by votes
I would have to see what you have going on exactly...I did this before and I just retested this quick before I get to sleep and it seems to work just fine for me.

I tested with the dev version and without any css rules in place and just judging by what I have in my opening html tag I would think this should be working for you.

HTML: 
<html id="XenForo" class=" Public LoggedIn Sidebar RunDeferred Responsive hasJs js no-flexbox canvas canvastext webgl no-touch geolocation postmessage no-websqldatabase indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients no-cssreflections csstransforms csstransforms3d csstransitions fontface generatedcontent video audio localstorage sessionstorage webworkers applicationcache svg inlinesvg smil svgclippaths" lang="en-US" xmlns:fb="http://www.facebook.com/2008/fbml" dir="LTR" style="">
 
Upvote 0 Downvote
Did not see that you removed it, but I did notice that on avforums.com front page you are loading jquery twice.
upload_2013-11-7_14-4-8.webp

Once is the default xF version, another one is 1.7.1 from google CDN. If modernizr is depending on jQuery, that might explain why it did not work.
 
Upvote 0 Downvote
page_container_js_head is where xenforo includes it by default..I would check there first and see if the second call was added

if you can't find it at all in any templates it may be in a template mod
 
Upvote 0 Downvote
Could be a simple mistake, once when I was making a jqui addon I tested the conflict workarounds in a standalone document, when I rebuilt it into xf I not only included the jqui script but jquery as well not even thinking about the fact that xf includes jq by default.

It should be as simple as removing the line that includes the second copy of jq or editing the TM if that is where it comes from.
 
Upvote 0 Downvote
You must log in or register to reply here.
Top Bottom