Bonjour,
Pour mon site web j'ai récupéré 2 scripts javascripts et je les ai adaptés.
Séparément ils fonctionnent sans problème mais ensemble il y a incompatibilité : les infobulles ne s'affichent pas.

Est-ce que quelqu'un pourrait m'aider à comprendre où se situe l'incompatibilité, je le remercie d'avance.

voici mon script :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Info Bulle Javascript</title>
<style type="text/css" media="all">
body {
 
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
}
.infobulle{
	position: absolute;	
	visibility : hidden;
	border: 1px solid Black;
	padding: 10px;
	font-family: Verdana, Arial;
	font-size: 10px;
	background-color: #FFFFCC;
}
.aide
{
width:300px;
background:red;
font-size:20pt;
}
.aider
{
width:200px;
background:blue;
font-size:10pt;
}
</style>
<script type="text/javascript" src="scripts/menu.js"></script>
<link rel="stylesheet" type="text/css" href="style/menu.css"/>
<script language="javascript" type="text/javascript">
				<!--
				function GetId(id)
				{
				return document.getElementById(id);
				}
				var i=false; // La variable i nous dit si la bulle est visible ou non
 
				function move(e) {
				  if(i) {  // Si la bulle est visible, on calcul en temps reel sa position ideale
				    if (navigator.appName!="Microsoft Internet Explorer") { // Si on est pas sous IE
				    GetId("curseur").style.left=e.pageX + 5+"px";
				    GetId("curseur").style.top=e.pageY + 10+"px";
				    }
				    else { // Modif proposé par TeDeum, merci à lui
				    if(document.documentElement.clientWidth>0) {
				        GetId("curseur").style.left=20+event.x+document.documentElement.scrollLeft+"px";
				        GetId("curseur").style.top=10+event.y+document.documentElement.scrollTop+"px";
				    }
				    else {
				        GetId("curseur").style.left=20+event.x+document.body.scrollLeft+"px";
				        GetId("curseur").style.top=10+event.y+document.body.scrollTop+"px";
				    }
				    }
				  }
				}
 
				function montreinfobulle(text) {
				  if(i==false) {
				  GetId("curseur").style.visibility="visible"; // Si il est cacher (la verif n'est qu'une securité) on le rend visible.
				  GetId("curseur").innerHTML = text; // Cette fonction est a améliorer, il parait qu'elle n'est pas valide (mais elle marche)
				  i=true;
				  }
				}
				function cacheinfobulle() {
				if(i==true) {
				GetId("curseur").style.visibility="hidden"; // Si la bulle etais visible on la cache
				i=false;
				}
				}
				document.onmousemove=move; // des que la souris bouge, on appelle la fonction move pour mettre a jour la position de la bulle.
				//-->
</script>
</head>
<body>
<div id="curseur" class="infobulle"></div>
<!--menu deroulant -->
<div id="ancre_menu">
<ul id="menu">
 
  <li><a href="index.php?lien=1">accueil</a></li>
   <li><a href="index.php?lien=999">essai requêtes</a></li>
 
 
		<li><a href="index.php?lien=1">Inscription</a></li>
		<li><a href="index.php?lien=121">Galeries photos</a></li>
 
 
	  <li>Box liens
		<ul>
			<li><a href="index.php?lien=24&amp;admaction=creer">Creation box liens</a></li>
			<li><a href="index.php?lien=24&amp;admaction=modifier">Modifier box liens</a></li>
  		</ul>
		</li>
</ul>
</div>
<!--infobulle-->
<h1>Infobulle Javascript personnalisable</h1>
<p><a href="#">Retour &agrave; l'article</a>.</p>
<p><img src="supergeek-06293-cf35b.png" alt="Une image test" onmouseover="montreinfobulle('<div class=\'aide\'>SuperGeek revient</div><div class=\'aider\'>SuperGeek revient</div> !');" onmouseout="cacheinfobulle();" />
</p>
</body>
</html>
voici le script externe du menu déroulant
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
 
<!--// Michel Deboom février 2005, menu arborescent expansif sans image 
    // paramétrage :
idMenu = 'menu'
idAncre = 'ancre_menu'
// mettre 0 pour désactiver une option :
mno = 1 // un seul sous-menu ouvert par niveau
lien_ouvert = location // lien ouvert par défaut
 
function initMenu(){
var pm;menuOuvert=[];// tableau des menus ouverts
objMenu=document.getElementById(idMenu);objMenu.className='menu';
liste=objMenu.getElementsByTagName('li');
for(i=0;i<liste.length;i++){L=liste[i];lien=L.firstChild.href;
  if(lien){L.className="normal" 
  // repère le lien de la page en cours
    if(lien == lien_ouvert){
      pm=L.parentNode;L.firstChild.className="lien_page"
    }
  }
  //ajoute un titre cliquable
  if(L.getElementsByTagName('ul')[0]){ // sous-menu éxistant
    titre=L.firstChild.data;L.removeChild(L.firstChild);
    L.innerHTML='<a href="#"title="développer" onkeydown="af(this)" onmousedown="af(this,1);return false">'+titre+'<\/a>'+L.innerHTML;
    ef(L.firstChild) // réduit les sous_menus
  }
}
// montre le lien de la page et ouvre les menus parents
gf=0;if(pm)while(pm.id!=idMenu && gf<30){af(pm.parentNode.firstChild);pm=pm.parentNode.parentNode}
ancreMenu();
}
 
function ancreMenu(){ // déplace le menu construit dans l'élément désigné.
  ancre=document.getElementById(idAncre);
  if(ancre){ancre.appendChild(objMenu);ancre.className='ancre_menu'}
}
 
function ef(el) { // réduit.
with (el){
  parentNode.getElementsByTagName('ul')[0].style.display="none";
  title="développer";parentNode.className="reduit";
  }
return false
}
 
function af(el,mulot) { // développe un sous-menu .
if(mulot)el.removeAttribute('href') // supprime le lien prévu pour la navigation clavier.
with(el){sous_menu=parentNode.getElementsByTagName('ul')[0]
  if(sous_menu.style.display=="none"){
    sous_menu.style.display="block";title="réduire";parentNode.className="ouvert";
   } else {sous_menu.style.display="none";title="développer";parentNode.className="reduit";}
  }
  niveau=0;
  // un seul menu ouvert par niveau
  while(sous_menu.id!=idMenu&& niveau<30){niveau++;sous_menu=sous_menu.parentNode.parentNode}
  if(menuOuvert[niveau] && el!=menuOuvert[niveau] && mno)ef(menuOuvert[niveau]);menuOuvert[niveau]=el;
}
 
// Fonction pour ajouter ou enlever un événement sans écraser l'éxistant. 
function addEvent(obj,evType,fn,capt){
if(obj.addEventListener){obj.addEventListener(evType,fn,capt);return true;} // DOM 2
else if(obj.attachEvent)obj.attachEvent("on"+evType,fn) // IE 5+
else {return false;}
} 
 
addEvent(window,"load",initMenu)
//-->
et le css externe du menu
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
 
* élément contenant le menu */
.ancre_menu{width:100%;text-align:left;}
 
/* style général des ul */
.menu,.menu ul{list-style-type:none;font-size: 10pt;}
.menu ul{margin:0;padding:0}
.menu{ text-align:left;margin:20px 0em 0 10px;color:#0066FF;font-size: 10pt;background-color:#ccc;width:97%;top:0;/*Gecko*/
  padding:0px;border:0px solid #ccc; overflow:hidden;text-align:left;}
 
/* liens du menu */
.menu .normal a{color:#0066FF;text-decoration:none;cursor:pointer;font-weight:normal;background: url(../images/bout1.gif) 0 0 no-repeat #ccc;padding:0 0 0 14px;margin:0;}
.normal a:hover,.normal a:active,.normal a:focus,.lien_page:hover,.lien_page:active,.lien_page:focus{
color:red;background-color:#ccc;}
/* lien qui correspond à la page en cours */
.lien_page{background-color:#ccc;}
 
/* titres de liste */
.reduit,.ouvert{padding:0 0 0 14px;margin:0;}
.reduit a,.ouvert a{text-decoration:none;color:#0066FF;overflow:hidden;}
.ouvert a{cursor:default;}
.reduit a{cursor:default;}
/* ajout des images puces */
.ouvert{background: url(../images/bout2.gif) 0 0 no-repeat #ccc;font-weight:bold;}
.reduit{background: url(../images/bout1.gif) 0 no-repeat;font-weight:normal;}
 
 
.menu li a
{
display: block;
}
#menuar
{
text-align:center;
margin:auto;
background:#ccc;
}
ul#menu
{
text-align:left;
}
div#ancre_menu
{
text-align:left;
}