11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à toute la communauté.

Voici mon soucis : j'utilise le plugin Tipsy pour afficher des info-bulles sur une map area. L'attribut title est bien modifié en original-title et la valeur est bien dupliquée.

Le soucis est que le bloc créé n'est pas du tout positionné au bon endroit mais plutot de manière anarchique sur la page.

Voici un extrait de mon code :


<div id="zonegeo">
	<map id="mapaz" name="mapaz">
		<area coords="38,9,8" href="#" title="Titre 1" shape="circle" />
	</map>
	<img src="/maps/france.jpg" usemap="#mapaz" />
</div>


Si vous avez une petite idée du problème, je suis preneur !

Merci à vous.
Modifié par Biniou (26 Apr 2012 - 17:04)
Ok premier élément de réflexion : dans le plugin, Tipsy récupère la position de l'élément grâce à la fonction offset() de jQuery.
Hors, dans le cas d'une area, le retour de cette fonction est 0. Même retour avec la fonction position(). Une note sur l'API dit ceci :

a écrit :
Note: jQuery does not support getting the position coordinates of hidden elements(...)


En essayant de changer la visibilité d'une area, cela ne marche toujours pas.

Je continue de chercher...

(Désolé, je me fais mes propres question-réponses, mais si ça peut aider quelqu'un d'autre après...)

EDIT : en modifiant area comme tel
area {
	display: inline;
	position: relative;
}

La tipsy s'affiche, je récupère bien l'offset, mais le bloc ne s'affiche pas au-dessus de ma zone. En effet, l'offset récupérer doit correspondre au bloc conteneur, à savoir la div (ou bien la map).
Modifié par Biniou (26 Apr 2012 - 17:04)