jQuery로 배경 이미지를 미리로드 하시겠습니까?

Question

div가 현재 none으로 표시되도록 설정되어 있습니다. Div에는 5000px 너비의 배경 이미지가 2000px 높이 있습니다.

버튼을 클릭하면 div 표시 attirbute가 jquery로 전환됩니다. 이미지가 너무 커서 div로드가 발생하고 이미지가 1/2 초 후에로드됩니다. 이미지가 준비 될 때까지 프리 로더를 표시하고 표시 할 수있는 함수가 있습니까?

감사

Answer 1

봅니다 이미지를 미리로드하는 기본 자바 스크립트의 Image 객체를 사용합니다.

또한 예를 들어 타일을 만들어 웹상에서 이러한 거대한 이미지를 사용하지 않는 것을 고려하십시오.

Answer 2

이 시도 :

http://ditio.net/2010/02/14/jquery-preload-images-tutorial-and-example/

Answer 3

이 질문에 그냥 아주 쉽게 시나리오에 적용 할 수 있습니다 자바 스크립트 있지만, 바닐라를 사용하여 다시 잠시을 게시 대답했다.

Preloading CSS Images

$(document).ready(function() { 

    var c = new Image(); 

    c.onload = function(){ 
     $("#Your Div ID").css("background-image", "url(Path to Background Image)"); 
    } 

    c.src = "Path to Background Image"; 

});