comportement en Incohérence jQuery selon le navigateur

Question

J'ai mon jquery:

$('.category-block').mouseover(
     function (e) { 
      $(this).find('.b-expand').show(); 

    }); 

     $('.category-block').mouseout(
     function (e) { 
      $(this).find('.b-expand').hide(); 

    }); 

Et html échantillon:

<div class="category-block" id="category-1"> 
     <a href="#">Mod</a> 
     <div class="b-expand" id="block-expand-1"> 
     TEST 
     </div> 
    </div> 

ci-dessus semble fonctionner dans Firefox et IE mais pas Safari et Chrome. Des idées?

Merci.

EDIT:

Si je change les js à:

$('.category-block').mouseover(
     function (e) { 
      $('.b-expand').show(); 

    }); 

     $('.category-block').mouseout(
     function (e) { 
      $('.b-expand').hide(); 

    }); 

Il fonctionnera, mais montrant bien sûr tous les b-expand est pas seulement l'un sous le parent. Ainsi, le problème est avec la découverte?

Il n'y a pas de propriétés CSS qui ne le montrent pas. De plus, il n'y a pas d'erreurs js lancées.

Answer 1

Ce que vous voulez sans doute est la suivante:

$('.category-block').hover(function() { 
    $(this).find('.b-expand').show(); 
}, function() { 
    $(this).find('.b-expand').hide(); 
}); 

Answer 2

Je viens de tester dans IE 8, FF 3,66, chrome 5.0.375 ... et Safari 4. cela fonctionne.

vous avez probablement un script quelque part ailleurs sur la page manquant a; quelque part sur la page.

manquant; et ceux-ci n'apparaissent pas toujours comme des erreurs de script.

vous pourriez également manquer un html similaire qui est en train de jouer avec la structure de la page.