Dan
Dan

Reputation: 1295

using yep/nope with document.ready

I am using yepnope.js but having a slight issue with on load loading a function

in the head i include yep nope and make a call to the relevant js file

<script type="text/javascript" src="/code/trunk/javascript/external/modernizr/modernizr-development.js"></script>

<script type="text/javascript" src="/code/trunk/javascript/external/yepnope.1.5.3-min.js"></script>

<script type="text/javascript">
yepnope({
  test: Modernizr.mq('only all and (max-width: 700px)'),
  yep: ['/templates/client/jquery/qff/plugin.mobile.js'],
  nope:['/templates/client/jquery/qff/plugin.website.js']
});    
</script>

and then at the bottom of the page

<script type="text/javascript">
jQuery(document).ready(function() 
{
    jQuery("#mainContent").setupQantas({
        startSlide: 1, 
        googleAnalytics:1,
        googleCode:""
    });
});
</script>

so i am looking at this on a main screen. so it's suppoed to call in plugin.mobile.js

in the plugin.mobile.js file

(function( $ ){

  $.fn.setupQantas = function( options ) {  

    // Create some defaults, extending them with any options that were provided
    var settings = $.extend( {
        startSlide: 1, 
        googleAnalytics:0, // 1 sends to google
        googleCode: ""
    }, options);

    var methods = {};

    return this.each(function() {        

        if (settings.startSlide === 1) {
            alert("slide = 1");     
        } else {
            alert("slide > 1");
        }
    });
  };
})( jQuery );// JavaScript Document 

instead of giving the alert slide 1 it has the error

jQuery("#mainContent").setupQantas is not a function

if i dont use yepnope and just have it in a script tag it works. There seems to be a delay on when the yepnope loads in the js file and doesnt seem to do before doc.ready

is there a way around this?

thanks

Upvotes: 4

Views: 1015

Answers (2)

Dan
Dan

Reputation: 1295

here is the code

<script type="text/javascript">

yepnope({
  test: Modernizr.mq('only all and (max-width: 700px)'),
  yep: ['/templates/client/jquery/qff/mobile.js'],
  nope:['/templates/client/jquery/qff/website.js'],
  complete: function () {
    jQuery("#mainContent").setupQantas({
        startSlide: 1, 
        googleAnalytics:1,
        googleCode:""
    });
  }
});


</script>

Upvotes: 0

Simon Boudrias
Simon Boudrias

Reputation: 44609

Yes there is a delay. That's all the point behind an asynchronous script loader.

You should use a callback after the script is loaded by yepnope. Check the complete and callback options.

Upvotes: 3

Related Questions