UN TOOL TIP (BULLE D'AIDE) COMPATIBLE IE ET MOZILLA, MODIFIANT SON OPACITÉ POUR APPARAÎTRE OU DISPARAÎTRE.

Commentaire de LUDINSKI le 18/08/2004 12:28:59

Merci Jesus !!
( j'pensais pas que je dirais ça un jour !! )

C'est bref, mais ça a le mérite d'être clair !!

N'hésite pas à mettre une note !!

Commentaire de LUDINSKI le 18/08/2004 14:34:47

Je ne sais pas pour les autres, je ne l'ai testé que sous IE 6 et Firefox.

Mais si tu peux me dire quelles sont les fonctions qui posent problèmes, ça serai sympa ;)

Commentaire de coucou747 le 18/08/2004 16:43:51

c'est a cause des divs, il y a une solution pour les gérer diférement, et ça pourait être portable, la c'est pas a la norme, enfin je ne penses pas.

Commentaire de LUDINSKI le 19/08/2004 08:53:10

Je viens de faire des essais avec autre-chose qu'un DIV et, effectivement, ça merde au niveau du ....innerHTLM = ... !!

Sinon, pour ta solution Coucou747, ça consisterai à quoi ?

Commentaire de jjdagadir le 19/08/2004 21:06:47

Bravo Ludinski, c'est clean et joli,
Kenavo

Commentaire de chimelpremier le 22/08/2004 18:17:45

Joli, quel travail : 226 lignes pour le fichier js. Tu es comme un poisson dans l'eau avec les objets javascripts.
Je ne connaissait pas la commande getElement qui à l'air de fonctionner sur mozilla et opéra 7. J'emploi habituellement getElementById. C'est peut-être le problème de Konquéror, ou alors ton code HTML qui n'est pas trés standard.
Un reproche pour ton infobulle, c'est la lenteur d'apparition, encore plus lente que par l'attribut title.
Concernant la variation d'opacité qui ne fonctionnait pas sur mozilla ni sur firefox, il faut remplacer
GetElement( "BORD_ToolTip" ).style.opacity = opacite;
par GetElement( "BORD_ToolTip" ).style.MozOpacity = opacite;
dans augmente et diminue l'opacité
Je me suis aussi penché aussi sur l'infobulle js il y a qqstps, ou je ne fait que récupérer l'attribut title des liens. J'essaierai d'y ajouter ta fonction de variation d'opacité qui m'a l'air cool.
exemple:
http://perso.wanadoo.fr/michel.deboom/halloween03.htm

Commentaire de coucou747 le 24/08/2004 18:47:26

En fait, j'ai trouvé d'ou vennait l'erreur, c'est des zip, et du dézipage par konquéror... ça ne cré pas de nouveaux dossiers mais ça mets : nom_du_dossier/nom_du_fichier a la place du nom du fichier, donc j'ai eu beau chercher dans le code, j'ai rien trouvé...
joli travail, ceci fonctionne sous mozilla et konqueror...
http://perso.wanadoo.fr/michel.deboom/halloween03.htm

Donc, toutes mes excuses.

Sinon, c'esp pas un peu bcp autant de lignes ?

Commentaire de LUDINSKI le 25/08/2004 12:45:28

Merci les gars, c'est vraiment cool.

Je garde tous vos bon conseils !!
Je suis quand même surpris de la compatibilité avec konqueror (s'il s'agit bien du mien !!)

Commentaire de mickaelpfr le 27/08/2004 15:38:13

tu n'a pas l'impression de t'etre inspiré de mon code ?????
no comment !!!!

Commentaire de mickaelpfr le 02/09/2004 18:09:57

lol

Commentaire de mickaelpfr le 03/09/2004 10:12:12

ce n'est pas ça , m'en fou royalement , mais il reprend le mm principe , sans mentionner qu'il s'est inspiré de qq d'autre c'est tout...

Commentaire de TrasherDemon le 05/10/2004 13:11:53

Petit problème genant : je'essaie d'afficher un tooltip sur un element dans une div, juske la, pas de problème.

Par contre, si la div qui contient tout le bazaar est en position:absolute, le tooltip refuse de s'afficher :-/

Any Idea?
Merci d'avance

Commentaire de LUDINSKI le 25/01/2005 15:24:15

TrasherDemon

Tout d'abord salut et desolé d'avoir mis autant de temp, mais voilà :

Pour afficher le ToolTip, je compare la position de la souris avec les coordonnées de l'élément sur lequel le ToolTip doit agir. Et les coordonnées de l'élément retournées dans ton cas, son relative à l'élément qui le contient (la dite DIV). Donc la comparaison n'est pas adaptée.

Bref, je n'est pas encore de solutions, mais j'y travail....

Commentaire de LUDINSKI le 26/01/2005 17:56:49

La source corrigé est disponible !!
Have fun

Commentaire de akcsawnp le 02/10/2006 02:04:13

bonjour
tres joli script !!

je m'embrouille tjour dans le poo alors je voudrais la meme chose mais sans repeter les new tooltipgest()
vu que j aurais un millier d'image, et que je ne peux pas rajouter 2 fois le meme id, pour alleger une seule boucle dans ce type :
for($i=0;$i<x;$i++){
<img id="img" src="image" $i>
}
toolTipGest.Add( "img", "image n° " $i );

merci d'avance

Commentaire de BOSSANT le 20/11/2008 19:16:53

C'est Encore moi.
Je pensais avoir trouver le truc :
    <img id="Pht" src="img.aspx?id=1" style="position: absolute; left: 650; top: 400;" ></img>

<script type="text/javascript">

toolTipGest.Add( "Pht", "<img src='img.aspx?id=1&Detail=1'></img>" );

</script>

Mais rien à faire...
Bizarement le jsp ne fonctionne pas. Pour info, je bosse avec vs2008 et j'ai placé le code dans une fenêtre fille de la master.
J'ai évidement placé dans le Head du master :
<script type="text/javascript" src="jsp/ToolTip.js"></script>
Avez vous une idée?

Commentaire de BOSSANT le 20/11/2008 22:39:45

L'image s'affiche sans aucun message d'erreur. Mais en fait, je commence à me demander si le pb vient de ton outil. Pour identifier le pb j'ai voulu faire un cas simple sans image dans le tooltip. rien à faire... J'ai utilisé une page simple (sans la raccrocher à la page master)... non plus
Le code que j'avais mis est le suivant :
<%@ Page Language="VB" AutoEventWireup="false"  CodeFile="Default2.aspx.vb" Inherits="Default2" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Page sans titre</title>
<script type="text/javascript" src="jsp/ToolTip.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <img id="Pht" src="img.aspx?id=1" alt="Test"/>
    
<script type="text/javascript">
toolTipGest.Add( "Pht", "<CENTER>Mettez le curseur sur un des élément<BR> pour afficher son <B>ToolTip</B> !!</CENTER>" );
</script>
    
    </form>
</body>
</html>

Après exécution, j'obtiens :

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
Page sans titre
</title>
<script type="text/javascript" src="jsp/ToolTip.js"></script>
</head>
<body>
    <form name="form1" method="post" action="Default2.aspx" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJNzgzNDMwNTMzZGQz+F9+cWrpaVAQ5OvRRmzV35betA==" />
</div>

    <img id="Pht" src="img.aspx?id=1" alt="Test"/>
    
<script type="text/javascript">
toolTipGest.Add( "Pht", "<CENTER>Mettez le curseur sur un des élément<BR> pour afficher son <B>ToolTip</B> !!</CENTER>" );
</script>
    
    </form>
</body>
</html>

Commentaire de BOSSANT le 21/11/2008 23:42:47

J'ai trouvé l'erreur.
La structure de ma page était du style :
<DIV id="Containeur">
   <DIV id="Col_Left">
   </DIV>
   <DIV id="Col_Right">
   </DIV>
</DIV>

J'ai du la modifier donc comme ça.
   <DIV id="Col_Left">
   </DIV>
   <DIV id="Col_Right">
   </DIV>