CODEWITHSUNDEEP
javascriptjquerymodernizr
Malachi
Malachi

Reputation: 977

Using Modernizr, but $ is not defined

I'm using Modernizr and I've copied my solution from another site where I've used it before and didn't have any issues.

When I load the page, I get the ReferenceError: $ is not defined. (referring to $(document).ready(function() {... )

Now I know I get that because jquery isn't loading, but I can't figure out what I'm missing here that prevents jquery from loading.

What am I missing??

Edit: Took the url out and posted the original code here:

<script src="http://www.domain.com/js/modernizer.custom.js"></script>
<script>
//use the modernizr load to load up external scripts. This will load the scripts asynchronously, but the order listed matters. Although it will load all scripts in parallel, it will execute them in the order listed

Modernizr.load([
{
    load: '//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'
},
{
    // test for media query support, if not load respond.js
    test : Modernizr.mq('only all'),
    // If not, load the respond.js file
    nope : '/js/respond.min.js' 
}
]); 
</script>

Upvotes: 0

Views: 1946

Answers (1)

Alnitak
Alnitak

Reputation: 339816

Don't use Modernizer.load for jQuery - the .load function is mostly intended for loading polyfills and compatibility plugins, etc.

Just load jQuery independently in its own <script> tag before you make any reference to $.

If you do want to keep using .load, you'll need to move your initial jQuery related code into the .load completion callback, so that you don't try to invoke jQuery until after Modernizr has asynchronously loaded it.

Upvotes: 4

Related Questions