Jquery .show pas animer correctement et ne pas saisir tous les liens dans la cible

Question

Essentiellement, je suis en train de charger du contenu dans un div, à partir d'un lien à l'intérieur de ce div. Maintenant ça marche jusqu'à un certain point. Mon code récupère les liens de la div cible et le clic anime la div 'content' et la remplace par la div 'content' sur le lien cible.

//Target links and call on click 
$('#scrollbox li a').click(function(){ 
//Define load paramaters 
var toLoad = $(this).attr('href')+' #content'; 
//Hide content 
$('#content').hide('fast',loadContent); 
//Remove Load Bar 
$('#load').remove(); 
//Show Load Bar 
$('#wrapper').append('<span id="load">LOADING...</span>'); 
$('#load').fadeIn('normal'); 


function loadContent() { 
    $('#content').empty().load(toLoad,'',showNewContent()) 
} 
function showNewContent() { 
    $('#content').show('slow',hideLoader()); 
} 
function hideLoader() { 
    $('#load').fadeOut('normal'); 
} 
return false; 

}); 

Le premier numéro est que après avoir caché vieux contenu, sur la projection du nouveau contenu, l'animation est saccadée, et le contenu VIEILLE est encore visible et anime jusqu'à ce que la dernière milisecond le nouveau contenu juste « clignote "in. Ne devrait-il pas cacher l'ancien contenu et montrer le nouveau contenu? J'ai essayé de résoudre ce problème avec .empty mais maintenant il se contente de faire comme s'il n'y avait aucune animation .show.

Le deuxième problème est que les seuls liens sur lesquels mon code semble avoir un effet sont les liens d'en-tête dans la div cible, les liens à l'intérieur de la div 'contenu' ne sont pas affectés et rechargent page entière. Dois-je cibler le div dans le div? Est-ce que je ne cible pas TOUS les liens dans la div dans mon code?

Si vous avez besoin de plus de précisions sur quelque chose s'il vous plaît faites le moi savoir.

Bravo et merci pour votre aide.

Answer 1

Fixé. Définir les animations à 0 alors qu'il n'y en avait pas du tout. (Donc sorte de correctif pas cher)

Commande .live() utilisée pour lier la commande à tous les liens suivants sur recharger.

$(document).ready(function(){ 

$('.scroll-pane').jScrollPane({showArrows: true}); 

$('#scrollbox a').live('click', function() { 
//all elements that exist now and elements added later 
//with this class have this click event attached 

//Define load paramaters 
var toLoad = $(this).attr('href')+' #content'; 
//Hide content 
$('#content').hide(0,loadContent); 

function loadContent() { 
    $('#content').load(toLoad,'',showNewContent()) 
} 
function showNewContent() { 
    $('#content').fadeIn(0); 
} 

return false; 


}); 

});