2013-08-17 7 views
0

나는 스타일 시트 href이 jQuery로 클릭 할 때 변경되는 스타일 시트 스위치 솔루션을 구현했다.ypsnope.js를 사용하여 CSS 파일을 적용하지 않고 미리로드하는 방법은 무엇입니까?

괜찮 았지만 첫 페이지로드시 다른 CSS 파일이로드되지 않았기 때문에 스타일 시트간에 변경하면 깜박임이 발생합니다 (사용 된 후에는 깜박임이 발생하지 않음).

그래서 내가 가진 CSS 파일을 미리로드 yepnope.js을 사용하고 있습니다 :

yepnope([{ 
    load: 'http://path/to/stylesheet_1.css', 
    callback: function (url, result, key) { 
    console.log(url, result, key); 
    } 
}, { 
    load: 'http://path/to/stylesheet_2.css', 
    callback: function (url, result, key) { 
    console.log(url, result, key); 
    } 
}]); 

그리고이로드 될 때 각각의 스타일이 적용되는 것을 제외하고 모든 것이 예상대로 작동합니다.

실제로 스타일 시트를 미리 적용하지 않아도 미리 적용 할 수 있습니까?

yepnope([{ 
    load: 'preload!http://path/to/stylesheet_1.css' 
}, { 
    load: 'preload!http://path/to/stylesheet_2.css' 
}]); 

자신의 documentation page에 대한 preload! Prefix을 읽고 그러나 그것은 작동하지 않았다

편집은

나는 또한 시도했다. 2

편집 또한 추가하는 시도 :

yepnope.addFilter(function (resourceObj) { 
    resourceObj.noexec = true; 

    return resourceObj; 
}); 

을하지만 영향을 미칠 것 같지 않았다.

답변

0

당신은 ajax가 css 파일을 요청하고 그 내용을 캐싱 할 수 있으며 나중에로드하려는 경우 스타일 태그에 붙여 넣을 수 있습니다.

0

그 작동하는 것 같다 사용하기 전에 당신은 '프리로드'접두사를 다시 정의하면 :

yepnope.addPrefix("preload", function(resource) { 
    resource.noexec = true; 
    return resource; 
}); 

출처 : https://gist.github.com/dzello/1015783