Déplacé une info-bulleRésolu

Question

Bonjour, J'essai de déplacer une info bulle (un span), sans grand résultat pour le moment... Je souhaite que l'utilisateur puisse déplacer le contenu de l'info, façon drag and drop. Voici ce que j'ai écris : function deplacenote(obj,event) { var e = event || window.event; var nx = e.clientX; var ny = e.clientY; if (clicenbas) { var diffx = parseInt(oldx)-parseInt(nx); var diffy = parseInt(oldy)-parseInt(ny); obj.style.bottom = (parseInt(obj.style.bottom) + parseInt(diffy))+'px'; obj.style.left = (parseInt(obj.style.left) - parseInt(diffx)) +'px'; } oldx = nx; oldy = ny; } Les variables oldx et oldy ainsi que sourisenbas sont globales, les valeurs sont mises à jour par une fonction qui écoute les clic souris... Et le code des infobulles : ; position : absolute; left:; top:" onmouseover="survolannotation(this, event);" onmouseout="finsurvolannotation(this, event);" > " ondblclick= 'window.location.replace("editeur.php?id=&iddoc=")'> " /> est ce qu'il est possible de déplacé un objet placé en "relative"? Est ce qu'il est possible de le placer audela du div? Merci de vos réponses

Bul3 · Accepted Answer

Bonjour,

déplacer un élément, c'est jouer
avec son style.left et style.top
en fonction de la position du la souris

var nx = e.clientx;
var ny = e.clienty;

exclusif Fx ça ( ça ne fonctionnera pas avec IE )

>>déplacer un objet placé en "relative"? 
faut qu'on s'entende ....
_ absolute c'est une position..... relative !!! ( sans rire )
par rapport au contenant ( qui peut-être le body )

_ relative, c'est par rapport à la position 
qu'occuperait l'élément s'il n'y avait pas
de style.position 

sur CodesSources, il y a une foultitude d'exemples
qui traitent de ce genre de choses

Cordialement

Xiarea · Answer

Merci Bul3!

En fait j'ai une erreur dans mon script, mais dans l'idée, j'étais dans le vrai ^^
Les valeurs de obj.style.left et obj.style.bottom n'étant pas initialisées, JS ne faisait pas le calcul de la nouvelle position de la façon que je voulais (la valeur restait vide)

solution => if(obj.style.left) {calcul} else {initialisation}

idem pour bottom.

Déplacé une info-bulle

2 réponses

Votre réponse

Discussions similaires