모더 나이저 스크립트 순서와 IE9

Question

나는 이런 식으로 내 문서의 머리에 JQuery와 및 모더 나이저를로드 해요 :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="js/modernizr-columntest.js"></script> 

"columntest.js"가 일부 사용자 지정 모더 나이저 코드를 바로 자신의 발전기에서, 조금으로

Modernizr.load({ 
    test: Modernizr.csscolumns, 
    nope: 'js/jquery.masonry.js' 
}); 

을하지만 플러그인은 IE9에서 제대로 발사되지 않습니다 yepnope 조건부 플러그인을로드 그것의 말에 붙여 부른다. headscratching을 많이 한 후에 IE9 dev 도구에서 조건부로로드 된 스크립트가있는 스크립트 태그가 modernizr 스크립트를 배치하는 요소에 동적으로 추가된다는 것을 알았습니다. modernizr 스크립트가 머리에 있으면 생성 된 스크립트 태그가 IE Dev Tools의 머리. 본문에 모더니즈 콜을 넣으면 생성 된 스크립트가 본문에 나타납니다.

그러나 문제는 플러그인 스크립트가 앞에 놓여 있고 jquery 스크립트보다 앞에있는 것 같습니다. 그리고 플러그인은 jquery가 작동해야합니다. 마크 업에서 jquery 스크립트 태그 다음에 modernizr 스크립트 태그를 쓰고 있지만 폴백 "nope"스크립트가 jquery 스크립트 앞에 삽입되어 있습니다. 응?

저는 아직도 비동기 작업에 적응하고 있습니다. 누군가가 이것을 논박하는 방법을 설명 할 수 있습니까? (나는 항상 내가 정말 어떤 모더 나이저 시험에 로딩 JQuery와 조건부 할 수 없습니다 페이지의 다른 요소에 대한 어쨌든 jQuery를 호출 할 필요가 있으므로.)

UPDATE

좋아, 지금은 (이야 모든 것을 비 윤리적으로 부르려고 노력하는 것.

Modernizr.load([ 
    'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', 
    { 
     test: Modernizr.csscolumns, 
     nope: 'jquery.masonry.min-pluscall.js' 
    }, 
    { 
     load: ["js/jquery-smoothscroll.js","js/jquery.colorbox-min.js"], 
     complete: function() { 
      $.colorbox.settings.fixed = true; 
        // MISCELLANEOUS SETTINGS ETC 
      $(document).ready(function() { 
       $('.thumbnail').colorbox({ 
        innerWidth: 800, 
       }); 
      }); 
     } 
    } 
]); 

그러나 이해할 수없는 것은 벽돌 플러그인은 단순히 실행되지 것입니다 :

<script src="js/modernizr-columntest.js"></script> 
<script src="js/envision-scriptloader.js"></script> 

scriptloader 파일이 포함되어 있습니다 : 머리에 스크립트 태그는 다음과 같이 선언됩니다. IE 9 Dev Tools에서 html 관리자의 스크립트는 여전히 jquery와 반대 순서로 나타납니다. 더욱 이상하게도, jquery 이전과 한 번 후에 벽돌 스크립트가 생성 된 코드에 두 번 나타납니다. (!) 머리 부분에서 다음과 같이 보입니다.

<script src="js/jquery.masonry.min-pluscall.js"></script> 
<script src="js/jquery-smoothscroll.js"></script> 
<script src="js/jquery.colorbox-min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="jquery.masonry.min-pluscall.js"></script> 
<script src="js/modernizr-columntest.js"></script> 
<script src="js/envision-scriptloader2.js"></script> 

help?

Answer 1

글쎄, 당신은이 문제에 휩쓸 렸습니다. 문제는 IE에서 플러그인이 비동기 적으로로드되는 동안 jQuery가 동 기적으로로드된다는 것입니다. 플러그인이 먼저로드되지만 실제로는 모든 브라우저에서 언제든지 발생할 수 있습니다.

Modernizr.load({ 
    load: 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', 
    complete: function(){ 
     Modernizr.load({ 
      test: Modernizr.csscolumns, 
      nope: 'js/jquery.masonry.js' 
     }); 
    }); 
}); 

EDIT 사실, 기술적으로, 당신이해야 할 모든 순서를 넣어

:이 솔루션은 complete 지점에서 플러그인을로드 한 후 비동기 적으로뿐만 아니라 jQuery를로드하는 것입니다. 다음과 같이 작동합니다.

Modernizr.load([ 
    'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', 
    { 
     test: Modernizr.csscolumns, 
     nope: 'js/jquery.masonry.js' 
    } 
]);