// When the document loads do everything inside here ...
 var $j = jQuery.noConflict();
$j(document).ready(function(){
$j("#loading").fadeOut("slow");
$j('.ajax_content').load('index.php?id=82'); //by default initally load text from boo.php
$j('.filter a').click(function() { //start function when any link is clicked
$j(".ajax_content").fadeOut("slow");
var content_show = $j(this).attr("title"); //retrieve title of link so we can compare with php file
$j.ajax({
method: "get",url: "index.php?id=82",data: "page="+content_show,
beforeSend: function(){$j("#loading").fadeIn("slow");}, //show loading just when link is clicked
complete: function(){ $j("#loading").fadeOut("slow");}, //stop showing loading when the process is complete
success: function(html){ //so, if data is retrieved, store it in html
$j(".ajax_content").animate({ opacity: 'show' }, "slow"); //animation
$j(".ajax_content").html(html); //show the html inside .content div
}
}); //close $j.ajax(
}); //close click(
}); //close $j(

