4

I'm having problems trying to load scripts using the Modernizr version of yepnope and can't get my head around why they are different. If I load the scripts using yep nope it works fine:

<script type="text/javascript" src="/js/yepnope.1.0.2-min.js"></script>
<script type="text/javascript">
yepnope([  
    '/js/fancy-box-2.0.4/jquery.fancybox.css',  
    '/js/jquery-1.7.min.js',  
    '/js/jquery.form-defaults.js',  
    '/js/jquery.cycle.all.js',  
    '/js/jquery.easing.1.3.js',  
    '/js/fancy-box-2.0.4/jquery.fancybox.js',  
    '/js/functions.js',  
    'http://use.typekit.com/uoy8fub.js'
]); 
</script>

But if I trying using the Modernizr packaged version of yep nope I can't get anything to load... Help?

<script type="text/javascript" src="/js/modernizr-2.0.6.js"></script>
<script type="text/javascript">
Modernizr.load([  
    '/js/fancy-box-2.0.4/jquery.fancybox.css',  
    '/js/modernizr-2.0.6.js',  
    '/js/jquery-1.7.min.js',  
    '/js/jquery.form-defaults.js',  
    '/js/jquery.cycle.all.js',  
    '/js/jquery.easing.1.3.js',  
    '/js/fancy-box-2.0.4/jquery.fancybox.js',  
    '/js/functions.js',  
    'http://use.typekit.com/uoy8fub.js'
]); 
</script>
Andy
  • 147
  • 2
  • 2
  • 12

2 Answers2

8

UPDATE: Modernizr.load has been deprecated in version 3.0 in favour of using YepNope.js directly.

It's worth noting that Modernizr.load just uses the yepnope library and they are interchangeable. e.g. 

yepnope({
  test : Modernizr.geolocation,
  yep  : 'normal.js',
  nope : ['polyfill.js', 'wrapper.js']
});

Modernizr.load({
  test : Modernizr.geolocation,
  yep  : 'normal.js',
  nope : ['polyfill.js', 'wrapper.js']
});

For yours, try:

Modernizr.load({
    load: [  
        '/js/fancy-box-2.0.4/jquery.fancybox.css',  
        '/js/jquery-1.7.min.js',  
        '/js/jquery.form-defaults.js',  
        '/js/jquery.cycle.all.js',  
        '/js/jquery.easing.1.3.js',  
        '/js/fancy-box-2.0.4/jquery.fancybox.js',  
        '/js/functions.js',  
        'http://use.typekit.com/uoy8fub.js'
    ]
});
Ash Clarke
  • 4,807
  • 1
  • 37
  • 48
  • Brilliant that works great! Looks like my syntax was a bit out. Thanks @ash-clarke – Andy Jan 18 '12 at 12:46
  • @ashclarke This does not seem to work anymore now that yepnop is deprecated – MicFin Jul 30 '15 at 17:19
  • 1
    @MicFin Given that this answer is over 3 years old, I'm not surprised. Not worth a downvote though. – Ash Clarke Jul 31 '15 at 15:26
  • Chrome console: `Modernizr.load is not a function` I'm calling modernizr.js in the and running this function before . Why isn't it working? – cbmtrx Dec 03 '15 at 18:55
  • `Modernizr.load has been deprecated in favor of using yepnope.js directly; from v3.0, yepnope.js must be included in the page in order for Modernizr.load to work: calling .load() will simply pass the arguments on to yepnope(); this will be removed fully in a future release` - https://modernizr.com/news/modernizr-3-new-release-site#apis – Ash Clarke Dec 04 '15 at 16:19
0

Modernizr needs a test to decide what to do. Generally Modernizr.load is used to load polyfills so you should read this: http://www.modernizr.com/docs/#load

Fabio Buda
  • 769
  • 2
  • 7
  • 16
  • 3
    Ok but surely if I can use the yep nope method without a test to asynchronously load my scripts I should be able to do the same thing using the Modernizr method? – Andy Jan 18 '12 at 12:35