Image Preloader via JSON, JQUERY, PHP

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

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