How can I load an external jQuery gallery/slideshow into a div
- by DanTransformer
Ive got a jQuery navigation menu loading external content into my #main div, which works fine when the content is static, but the site im working on contains jQuery galleries/slideshows which id like to call into the div. The problem im having is when the gallery is loaded, the images all appear but the jQuery functionality does not work.
Any help appreciated.
here is the javascript im using...
$(document).ready(function() {
// Check for hash value in URL
var hash = window.location.hash.substr(1);
var href = $('#accordion ul li a').each(function(){
var href = $(this).attr('href');
if(hash==href.substr(0,href.length-5)){
var toLoad = hash+'.html #main';
$('#main').load(toLoad)
}
});
$('#accordion ul li a').click(function(){
var toLoad = $(this).attr('href')+' #main';
$('#main').hide('fast',loadContent);
$('#load').remove();
$('#wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('normal');
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#main').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#main').show('normal',hideLoader());
}
function hideLoader() {
$('#load').fadeOut('normal');
}
return false;
});
});
