Modernizrのロード方法

Question

Modernizrのロードに問題があります。 Modernizr、jQuery、Nivo-sliderを使用しています。 私のホームページをリフレッシュすると、スライダが正しく表示されないことがあります。時にはすべてが素晴らしいです。

私の方法は正しいことですか？

HTML：master.jsで

<!-- SCRIPTS --> 
<script type="text/javascript" src="js/plugins/modernizr-2.0.6.js"></script> 
<script type="text/javascript" src="js/master.js"></script> 

：

Modernizr.load([ 
{ 
load: 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js', 
complete: function() { 
    if (!window.jQuery) { 
     Modernizr.load('js/plugins/jquery-1.7.1.js'); 
    } 
    init(); 
} 
}, 
{ 
load: 'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js', 
complete: function() { 
    if (!window.jQuery) { 
     Modernizr.load('js/plugins/jquery-ui-1.8.16.js'); 
    } 
} 
} 
]); 

// START ****** 
function init() { 
$(document).ready(function(){ 

    // Home > Slider ---------------------------------------------- 
    if($('#slider').length){ 
     Modernizr.load([ 
      { 
      both: [ 'js/plugins/jquery-nivoslider.js', 'css/nivo-slider.css' ], 
      complete: function(){ 
       $('#slider').nivoSlider({ 
        effect: 'fade', // Specify sets like: 'fold,fade,sliceDown' 
        animSpeed: 1000, // Slide transition speed 
        pauseTime: 5000, // How long each slide will show 
        startSlide: 0, // Set starting Slide (0 index) 
        directionNav: true, // Next & Prev navigation 
        directionNavHide: false, // Only show on hover 
        controlNav: true, // 1,2,3... navigation 
        controlNavThumbs: false, // Use thumbnails for Control Nav 
        controlNavThumbsFromRel: false, // Use image rel for thumbs 
        controlNavThumbsSearch: '.jpg', // Replace this with... 
        controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src 
        keyboardNav: true, // Use left & right arrows 
        pauseOnHover: true, // Stop animation while hovering 
        manualAdvance: false, // Force manual transitions 
        captionOpacity: 1, // Universal caption opacity 
        prevText: '', // Prev directionNav text 
        nextText: '', // Next directionNav text 
        randomStart: false, // Start on a random slide 
        beforeChange: function(){}, // Triggers before a slide transition 
        afterChange: function(){}, // Triggers after a slide transition 
        slideshowEnd: function(){}, // Triggers after all slides have been shown 
        lastSlide: function(){}, // Triggers when last slide is shown 
        afterLoad: function(){} // Triggers when slider has loaded 
       }); 
      } 
      } 
     ]);   

    } 

}); 
} 
// END ****** 

Answer 1

あなたはタイミングの問題を持っているように見えます。 jQueryUIがロードされる前init()が呼び出されているが、それは簡単な修正です：

Modernizr.load({ 
    load: [ 
    'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js', 
    'https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js' 
    ], 
    complete: function() { 
    if (!window.jQuery) { 
     Modernizr.load(
     load: [ 
      'js/plugins/jquery-1.7.1.js', 
      'js/plugins/jquery-ui-1.8.16.js' 
     ], 
     complete : function(){ 
      init(); 
     }); 
    } else { 
     init(); 
    } 
    } 
}); 

私はこのコードをテストしていませんが、基本的にあなたが両方 jQueryとjQueryUIまで待つ必要があるは、initを呼び出すことができます前にロードされています（）;