I have a list of galleries, when you click on the title of a gallery it pulls in the contents (HTML with images).
When the content is pulled in it preloads the html but not the images, any ideas?
This is the JavaScript i'm using:
$('#ajax-load').ajaxStart(function() {
$(this).show();
}).ajaxStop(function() { $(this).hide();});
// PORTFOLIO SECTION
// Hide project details on load
$('.project > .details').hide();
// Slide details up / down on click
$('.ajax > .header').click(function () {
if ($(this).siblings(".details").is(":hidden")) {
var detailUrl = $(this).find("a").attr("href");
var $details = $(this).siblings(".details");
$.ajax({
url: detailUrl,
data: "",
type: "GET",
success: function(data) {
$details.empty();
$details.html(data);
$details.find("ul.project-nav").tabs($details.find(".pane"), {effect: 'fade'});
$details.slideDown("slow");
}});
}
else {$(this).siblings(".details").slideUp();}
return false;
});
You can see this demonstrated at http://www.georgewiscombe.com
Thanks in advance!