Erreur Javascript / Fancybox?

Sur ma page, j’ai 6 cases en dessous d’une image principale qui utilise JS pour avoir un effet de fondu agréable. Sur cette page, j’ai également Fancybox Load au début de la page (en utilisant onload) pour afficher une image que l’utilisateur doit voir.

Le problème est que lorsque l’utilisateur charge pour la première fois la page, une des boîtes va à peine montrer, voici une capture d’écran du problème: http://screencast.com/t/ROU61nMSgzy

La question est de savoir comment résoudre ce problème afin que ce problème ne se produise pas. Remarque: une fois la page mise en cache, ce problème ne se produit pas.

Voici le JS pour les boîtes:

var $j = jQuery.noConflict(); $j(document).ready(function(){ Engine.Initialize(); if( !$j('body').hasClass('index') && !$j('body').hasClass('homepage') ) { } }); var Engine = { Initialize: function() { Engine.Homepage_Animation(); }, Homepage_Animation: function() { if( !$j.browser.msie ) { $j('#homepage-main-item img').hide().fadeIn(700, function(){ $j(this).css('display', 'block'); $j('#homepage-boxes .boxes').each(function(i) { $j(this).delay(100 * i).animate({ opacity: 1 }, 300); }); }); } else { $j('#homepage-main-item img').css('display', 'block'); $j('#homepage-boxes .boxes').css('opacity', 1); } }, }

Voici le JS pour la Fancybox.

   var $j = jQuery.noConflict(); $j(document).ready(function(){ $j("#start").fancybox({ 'padding' : 0 }); });

HTML pour Fancybox

Merci pour toute aide =>

Si vous voulez que fancybox soit exécuté en premier, utilisez le rappel fancybox onComplete:

 $j(document).ready(function(){ $j('#start').fancybox({ 'onComplete': function () { Engine.Initialize(); } }); });

sinon, insérez le code fancybox après avoir appelé votre fonction d’initialisation personnalisée:

 $j(document).ready(function(){ Engine.Initialize(); $j("#start").fancybox({ 'padding' : 0 }); });