Image Preloader via JSON, JQUERY, PHP

Question

Hi there, im attempting to make a auto preloader via php an JSON my reason being no other preloaders suit my purposes at this time. Im developing off a WAMP installation with php version 5.3.0 an apache version 2.2.11 an using the following php code:

$rootDir =  dirname(__FILE__).'/..';
$imgdir = opendir($rootDir.'/images/');
$i=0;

while ($file = readdir($imgdir))
{
if (($file != '.') && ($file != '..'))
{
$fileList[$i] = $file;
$i++;
}
}

$json=json_encode($fileList, JSON_FORCE_OBJECT);
die($json);

My Jquery is inline/embeded at the moment (version 1.4.2) and is as follows:

$(document).ready(function(){
    $.ajax({
        type: "GET",
        url: "preload/reader.php",
        dataType: "JSON",
        success: function(data){
            alert(data);
        }
    });
});

this has the following output in an alert box; {"0":"BlueHills.jpg","1":"deagle_descr.jpg","2":"mod.jpg"}

the problem actually starts when i want to do anything else with data, the page never finishes loading like it's stuck in an infinite loop or something. Even just a simple statement like document.write(data); it the page is stuck in loading state until i hit stop in the browser. Im fairly new to JSON please help

Answer 1

1. use getJSON
2. in the callback function of getJSON, start adding tags to the DOM, but hidden by default
3. show then new images whenever you need