How about Modernizr?

Mascatu,

Thanks for the well wishes! Little one is a precious addition to the family, though sleep is not plentiful we are doing well.

In regards to Modernizr, I would suggest manually placing the script into the head similar to the examples listed in the other support threads as well as here: joshuadnelson.com/scripts-to-footer-plugin.

There are plenty of scripts out there that should be placed in the head, and plenty of others that can be placed in the footer. The code mentioned above coupled with this plugin can provide you the best of both worlds.

Hope that helps,
Joshua

Hey Guys,
We acutally have an active conversation about this right now

The general advice is to keep it in the head, to avoid flash of unstyled content, but there are some cavets to that rule that Paul Irish mentions.

Feel free to chime in with opinions on the thread!

Thanks Joshua and @patrickkettner for your answers.

However, not sure I understand correctly: can I place only modernizr in the header without jQuery before?
I mean the following scheme can be right?

• Modernizr – to the head
• jQuery – to the bottom?

Thanks

Hey @mascatu,

There is nothing in modernizr that requires jQuery, however you may be using Modernizr.load/yepnope to load in a polyfill and that requires jQuery. In which case you would need to make sure jQuery is loaded before your customer tests.

Also, if you don’t need Modernizr for styling, and don’t need to check the properties (e.g. Modernizr.foo) until after the page renders, then by all means put Modernizr in the footer.

Thanks @patrickkettner,

That cleared things up for me ??
I’ve noticed some WordPress themes enqueue modernizr with $deps set to true like array( 'jquery' )... that declare the jQuery must be loaded before modernizr and I was confused thinking that there is a jQuery dependency in this regard.

My main concern now will be to find out if Modernizr is needed to check the properties in my theme or needed for styling in my 1000 lines of CSS code currently used in my theme:) Do you have any tips on this regard?

Best

You can search for any of the classes that are added to you html element on page load, in addition to the .no- version of each. Once you have that list, I would loop over it, grepping for each over your code

something like the following in bash

for i in $(thing-that-gives-you-a-list-of-your-specific-modernizr-build) | grep -R $i ./yourCssDirectory

that should output anything that matches the list.

Great little piece of code. Thanks for this and for your time!

Patrick, thanks for your input and that link – great information!

Mascatu, sounds like this is resolved yea? I’m marking it as such, but feel free to reach out if there are other issues.