Function loading with Modernizr Load

Question

I am trying to impliment a simple jQuery scroll to top function on my site. I tested the code with just jquery/script and it works but when I move the code into Modernizr's conditional load it breaks.

I can't see what I need to set up with the conditional loading to start the function.

Modernizr.load([
{
    load: '//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js',
    callback: function() {
        if (!window.jQuery) {
            Modernizr.load('../bower_components/jquery/dist/jquery.min.js');
        }
    },
    complete: function(){
        // External link for rel tags
        $('a[rel="external"]').attr('target', '_blank');

        // Scroll to top
        $(function(){
            $(document).on( 'scroll', function(){
                if ($(window).scrollTop() > 100) {
                    $('.scroll-top-wrapper').addClass('show');
                } else {
                    $('.scroll-top-wrapper').removeClass('show');
                }
            });

            $('.scroll-top-wrapper').on('click', scrollToTop);
        });

        function scrollToTop() {
            verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0;
            element = $('body');
            offset = element.offset();
            offsetTop = offset.top;
            $('html, body').animate({scrollTop: offsetTop}, 500, 'linear');
        }
    }
},

Answer 1

You need to change the load url to:

load: 'https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'

Currently, it is not able to call the jquery library from the cdn url you provided.

To help you understand how cdn's work try put both these url's into your browser.

https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js will see jquery library

//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js will show error