사전로드 이미지로 그립 가져 오기

JS를 사용하여 이미지를 미리로드하는 데 몇 가지 문제가 있습니다. 나는 세 개의 이미지 객체를 만들고 하나씩로드하려고 시도하고있는 바이올린을 가지고 있지만 하나의 이미지 만 얻고 있습니까? 어떤 도움을 주셔서 감사합니다.사전로드 이미지로 그립 가져 오기

http://jsfiddle.net/gq1oqnxb/1/

<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 

     var images = new Array(); 

    images[0] = 'http://hdcomputerwallpaper.com/wp-content/uploads/2013/12/Puppy-images.jpg'; 
    images[1] = 'http://hdcomputerwallpaper.com/wp-content/uploads/2013/12/Puppy-images.jpg'; 
    images[2] = 'http://wallfc.com/wp-content/uploads/2014/09/Little-Birds.jpg'; 
    var i = 0;  

    while(i < images.length){ 

    var image = new Image(50,50); 
    image.src = images[i]; 
    image.onload = function(){ 

         $('body').append(image); 
         i++; 
           } 
    i++ 
    } 



    }); 

</script> 
</head> 

<body> 

</body>

출처

2014-10-04 user3760639

Fiddle Demo

imageLoader(0); //call the function with first image to load `0` as index starts from `0` 
function imageLoader(i) { //function to load images one by one and pass the array index 
    var image = new Image(50, 50); //create a new image 
    image.src = images[i]; //set src of the image from images array 
    image.onload = function() { //on image load 
     $('body').append(image); //append to the the body 
     if (++i >= images.length) return; //increment i check the length of images is exceeded than return 
     imageLoader(i); //more images are present in array then call the function again 
    } 
}

출처

2014-10-04 16:01:33

사전로드 이미지로 그립 가져 오기

답변

관련 문제