18-04-2009, 12:24 AM
(Modification du message : 18-04-2009, 12:25 AM par jo_link_noir.)
En fait c'est la fonction dans le mousemove qui va chercher les infos dont t'as besoin. Si tu veux passer des paramètres différent selon l'info-bulle, ça risque d'être un peu dur. Mais j'imagine qu'il n'y aura que du texte, non ? Dans ce cas le plus simple est d'afficher le texte dans le html, le cacher avec le css et avec le js joué sur la visibilité.
J'te montre un exemple
J'te montre un exemple
<html>
<head>
<script src="jquery-1.3.1.min.js" type="text/javascript"></script>
<script type="text/javascript"><!--
$(document).ready(function(){
//sélectionne les infobulles
$('a.infoBulle')
//quand la sourie passe dessus
.mousemove(function(){
//sélectionne le texte de l'infobulle.
//(div.infoBulleTexte situé à la suite de a.infoBulle)
//l'affiche
$(this).next('div.infoBulleTexte').css({visibility:"visible", width:400, height:400});
})
//quand la sourie quitte l'élément
.mouseout(function(){
//sélectionne le texte de l'infobulle et le fait disparaître
$(this).next('div.infoBulleTexte').css({visibility:"hidden"});
});
});
--></script>
</head>
<body>
<a href="#" class="infoBulle">teste info bulle</a>
<div class="infoBulleTexte" style="position:absolute; visibility:hidden; z-index:1000;">
<h1>Banzai !</h1>teste
</div>
<a href="#" class="infoBulle">teste info bulle 2</a>
<div class="infoBulleTexte" style="position:absolute; visibility:hidden; z-index:1000;">
<h1>Bambou !</h1>teste 2
</div>
</body>
</html>