Привет Всем !
Задача такая получаю от PHP Json
такого вида:
["photos\/small_14.jpg","photos\/small_6.jpg","photos\/small_7.jpg"]
Хочу сделать постепенную загрузку ВСЕХ изображений с пелоадером...
но он выводит только одну картинку.
Как исправить ????? Спасибо
<div id="miniatures"></div>
$(document).ready(function(){
var imgObj = new Image();
var i = 0;
//Рисую <div> в коротом background прелоадера
function loadImages(imgsJsonArr){
if (imgsJsonArr[i] != undefined ) {
$("#miniatures").append($("<div class = loader>"));
//загружаю изображени
viewLoadedImage(imgObj, imgsJsonArr);
}else{
//alert("STOP");
}
}
//загрузка и вывод изобрж
function viewLoadedImage(imgObj, imgsJsonArr){
$(imgObj).load(function () {
$(this).hide();
$('.loader').append(this);
$(this).fadeIn();
}).error(function(){
//$(this).attr("src","error.png");
}).attr('src', imgsJsonArr[i]);
//Если выключить выведет только одно изобржение как надо!!!
loadImages(imgsJsonArr, i++)
}
$.ajax({
type: "GET",
url: "ajax.php",
success: function(data){
var imgsJsonArr = JSON.parse(data);
//var imgsCountLength = imgsJsonArr.length;
loadImages(imgsJsonArr);
}
});
});