J'essaie de charger des éléments aléatoires dans un div toutes les quelques secondes, avec une belle transition fadeOut/fadeIn entre chaque charge. Voici le code:Pourquoi jQuery fadeOut ne fonctionne-t-il pas dans cette boucle setInterval?
<html>
<body>
<div id="item"></div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
// Load a random item
var item = $('#item');
function load_item() {
item.fadeOut(5000, function() {
item.load('http://dynamic.xkcd.com/comic/random/ #middleContent img', null, function() {
item.fadeIn(5000);
});
});
};
// Load initial featured item
load_item();
// Schedule repeated loading
setInterval(load_item, 15000);
</script>
</body>
</html>
Cela fonctionne bien la première fois à travers, mais les appels suivants à load_item, le fadeOut() semble cesser de fonctionner. Il ne fait pas disparaître le #item div out, mais saute immédiatement dans la fonction de rappel, en ignorant le délai 5000.
Qu'est-ce que je fais mal?
Il semble fonctionner très bien pour moi, je l'ai essayé sur Firefox 3.5 – JasonWyatt
Peut-être quand load_item() est appelée deuxième fois fadeout appelle immédiatement la fonction de rappel parce que #item est déjà caché, donc fadeOut ne fait pas l'animation de 5000 ms? – Roman
C'est ce que je pensais, mais le #item div est visible (je peux le voir), donc je ne sais pas pourquoi fadeOut() pense qu'il est caché. – claymation