$(document).ready(function(){   
    xmldata=new Array();            //initialise array for XML data   
  
    fade=0;                         //time taken for transitions   
    ontime=0;                       //time between transitions   
    changenum=0;                    //current banner   
    changetot=0;                    //total banners   
  
    $("#banner").fadeTo(1,0);       //fade out the fallback banner   
  
    $.ajax({                                            //get the XML data   
            url: "xml/banners.php",                         //URL to get the data from   
            success: function(data) {                   //if we succeed, set everything up. We don't expect failure.   
                $(data).find("picture").each(function()   
                 {   
                    xmldata.push($(this));              //add item into array   
                 });   
                 changetot=xmldata.length;                              //get total length   
                 ontime=eval($(data).find("gallery").attr("ontime"));   //get fade time   
                 fade=eval($(data).find("gallery").attr("fade"));       //get time between fades   
  
                 change_banner(changenum);                              //change banner for first banner   
  
                }   
        });   
});   
  
function change_banner(){   
  
    data=xmldata[changenum];                    //get current banner XML object    
  
    img=$(data).attr("src");                    //retrieve variables   
    href=$(data).attr("href");   
    target=$(data).attr("target");   
  
    $("#banner_href").attr("href",href);        //change variables on HTML   
    $("#banner_href").attr("target",target);   
    $("#banner_image").attr("src",img);   
  
    changenum++;                //increment banner value, this is executed BEFORE the callback as we already have the variables.   
    if(changenum>=changetot) //check for banner value bounds   
        changenum=0;       
  
    cache = document.createElement('img');          //create an image   
    cache.src = $(xmldata[changenum]).attr("src");  //pre-cache next image (means the browser will load it instantly)          
  
    $("#banner").fadeTo(fade,1).fadeTo(ontime,1).fadeTo(fade,0,change_banner);      //fade banner in, then wait, then fade out and call back to this function.   
  
}