[Javascript] modification infobulle

[phenix]

Bonjour à tous,

Voila un script que j'ai repêché sur un autre site, je voudrais le modifier mais étant un bulle en JS j'ai un peu de mal.
Je voudrais que:

- Lorsque l'on passe la souris sur un élément (OnMousOver) l'info-bulle apparaisse puis disparaisse quand on quitte élément. (Sa sa marche :good
- Lorsque l'on clique (OnClick) l'infobulle ce fixe pour que l'on puisse cliquer sur des liens dans l'infobulle.

J'ai essayer dans l'état actuel des choses, mais j'arrive à rien. Si on utiliser onclick:

1) l'info bulle ne ce "fige" pas.
2) il faut cliquer puis bouger la souris sinon elle apparaît pas.

Voila le script, si quelqu'un sais comment le modifier sa peut servir à pas mal de monde:

Code :

var ini = 0
var offsetx = 8
var offsety = 12
var ie  = document.all
var ns6 = document.getElementById && !document.all
var enabletip = false
var contentObj, contentTxt

function ce(x) {
    return document.createElement(x);
}

function InitTip()
{
    var d = ce("div"), t=ce("table"), tb=ce("tbody"), tr1=ce("tr"), tr2=ce("tr"), td=ce("td"), th1=ce("th"), th2=ce("th"), th3=ce("th");

    d.className="wttip";
    d.style.visibility = "hidden"
    d.style.position = "absolute"
    d.style.zIndex = 9999;

    t.cellSpacing=0;
    t.cellPadding=0;
    th1.style.backgroundPosition="top right";
    th2.style.backgroundPosition="bottom left";
    th3.style.backgroundPosition="bottom right";

    tr1.appendChild(td);
    tr1.appendChild(th1);
    tb.appendChild(tr1);
    tr2.appendChild(th2);
    tr2.appendChild(th3);
    tb.appendChild(tr2);
    t.appendChild(tb);
    d.appendChild(t);
    document.body.appendChild(d);

    contentObj = d
    contentTxt = td
    ini = 1
}

function ietruebody()
{
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function positiontip(e)
{
    if (enabletip) {
        var curX = (ns6) ? e.pageX : event.x + ietruebody().scrollLeft;
        var curY = (ns6) ? e.pageY : event.y + ietruebody().scrollTop;

        var distX = ie && !window.opera ? ietruebody().clientWidth  - event.clientX-offsetx : window.innerWidth  - e.clientX-offsetx-20
        var distY = ie && !window.opera ? ietruebody().clientHeight - event.clientY-offsety : window.innerHeight - e.clientY-offsety-20

        if (distX < contentObj.offsetWidth) {
            if (curX+offsetx-contentObj.offsetWidth < 0)
              contentObj.style.left = "0px"
            else
              contentObj.style.left = curX-10-contentObj.offsetWidth+"px"
        } else {
            contentObj.style.left = curX+offsetx+"px"
        }

        if (distY < contentObj.offsetHeight) {
            if (curY > contentObj.offsetHeight)
              contentObj.style.top = curY-10-contentObj.offsetHeight+"px"
            else
              contentObj.style.top = curY+offsety+distY-contentObj.offsetHeight+"px"
        } else {
            contentObj.style.top = curY+offsety+"px"
        }

    }
}

function ShowTip(msg, larg)
{
    if (!ini) InitTip()
    if (!larg) larg=250

    contentTxt.innerHTML=msg
    contentTxt.style.width=larg+"px"
    enabletip=true
    contentObj.style.visibility="visible"
    return false
}

function nd()
{
    enabletip = false
    contentObj.style.visibility = "hidden"
    contentObj.style.left = "-1000px"
}

if (!ini) {
    document.onmousemove=positiontip
}

Voici le site de provenance: http://www.lootup.com/index.php?title=Accueil

Merci d'avance à tous,

Phenix

[Anthor]

Il est ou le tooltip ?

Tu aurais un exemple complet pu tester ?

[phenix]

Il est ou le tooltip ?

Bha c'est la fonction showtip, si c'est sa que tu me demande.

Tu aurais un exemple complet pu tester ?

Bha si tu vas sur http://www.lootup.com/index.php?title=Accueil tu pourras la voir en action (passe la souris sur les icône de WoW ).

Maintenant je trouve pas comment modifier pour faire ce que je veux :heuuu:

[Shakkah]

Tu appel quel méthode lors du clic ?

Sur le site que tu as donné , à quel endroit tu a vu une popup se fixait au clic ?

[Ruz]

Perso, j'utilise la librairie "OverLib", qui fonctionne à merveille pour ce que tu cherches...

http://www.bosrup.com/web/overlib/

[Shakkah]

Perso, j'utilise la librairie "OverLib", qui fonctionne à merveille pour ce que tu cherches...

http://www.bosrup.com/web/overlib/

J'utilise aussi overlib mais je pense pas qu'ele gére le freeze lors du clic.

[Anthor]

Je vois.

Je parlais plus d'une page comme la pièce jointe. Que chacun puisse tester facilement.

[Anthor]

En prime t'as même le droit à un essai de modification !

[phenix]

Perso, j'utilise la librairie "OverLib", qui fonctionne à merveille pour ce que tu cherches...

C'est ce que j'utilise actuellement, mais elle a de gros défaut:

- La dernière version ne modifie plus la position pour quelle soit toujours sur l'écran.
- C'est lourd lourd lourd...

J'utilise aussi overlib mais je pense pas qu'ele gére le freeze lors du clic.

Si, avec le parametre stiky je crois, ou un truc du genre.

Je parlais plus d'une page comme la pièce jointe. Que chacun puisse tester facilement.

Ha pardon, j'avais pas comprit.

Ta modification me plaît bien, mais il reste 1 soucis (Dont 1 que j'avais pas mentionner, sorry)

- Si tu clique ailleurs sur la page elle ce "défreeze" pas... m'enfin c'est accessoire...

[EDIT]: Une idée peut être serait de crée une fonction qui efface la bulle j'ai essaye d'inverser ta fonction BlockTip() mais je suis pas doué sa a rien donnée...

[EDIT2] Finalement j'ai réussit, j'up un nouveau fichier

[Anthor]

Avec "defreeze"