Probleme d'affichage d'un div

carlos61 · Message par **carlos61** » 23 oct. 2007, 17:49

Bonjour,

Voici un code qui fonctionne bien sous ie mais pas sous firefox.

Qui peux m'aider ? et me faire comprendre pourquoi ?

Merci

Code : Tout sélectionner

<html>
<head>

<!--DEBUT DU CODE ROLLOVER 1-->
<script LANGUAGE="Javascript">
IE4 = (document.all) ? 1 : 0;
NS4 = (document.layers) ? 1 : 0;
VERSION4 = (IE4 | NS4) ? 1 : 0;

if (!VERSION4) event = null;

function helpGetOffset(obj, coord) {
    var val = obj["offset"+coord] ;
    if (coord == "Top") val += obj.offsetHeight;
    while ((obj = obj.offsetParent )!=null) {
        val += obj["offset"+coord];
        if (obj.border && obj.border != 0) val++;
    }
    return val;
		
}

function helpDown () {
    if (IE4) document.all.helpBox.style.visibility = "hidden";
    if (NS4) document.helpBox.visibility = "hidden";
}

function helpOver (event,texte) {
    if (!VERSION4) return;

    var ptrObj, ptrLayer;
    if (IE4) {
        ptrObj = event.srcElement;
        ptrLayer = document.all.helpBox;
    }
    if (NS4) {
        ptrObj = event.target;
        ptrLayer = document.helpBox;
    }

    if (!ptrObj.onmouseout) ptrObj.onmouseout = helpDown;

    var str = '<DIV CLASS="helpBoxDIV">'+texte+'</DIV>';
    if (IE4) {
        ptrLayer.innerHTML = str;
        ptrLayer.style.top = helpGetOffset (ptrObj,"Top") + +50;
        ptrLayer.style.left = helpGetOffset (ptrObj,"Left")+150;
        ptrLayer.style.visibility = "visible";
    }
    if (NS4) {
				ptrLayer.document.write (str);
        ptrLayer.document.close();
        ptrLayer.document.bgColor = "yellow";
        ptrLayer.top = (ptrObj.y + 20) + "px";
        ptrLayer.left = ptrObj.x + "px";
        ptrLayer.visibility = "visible";
    }
}
// -->
</script>

<style TYPE="text/css">
<!--
#helpBox {
    position: absolute;
    z-index: 1000;
    top: 0px;
    left: 0px;
		width:250px;
		
}
DIV.helpBoxDIV {

    padding: 2px;
    background: white;
    border: 1px solid black;

    color: black;
    font-family: Arial,Helvetica;
    font-style: Normal;
    font-weight: Normal;
    font-size: 10px;
    line-height: 14px;
}
-->
</style>
<!--FIN DU CODE ROLLOVER 1-->

</head>
<body>
<br>
<table width=40% border=1 >		
	<tr>
		<td><a onMouseOver="helpOver(event,'Calque affiché')">Passez la souris pour afficher le calque</a></td>
	</tr>
</table>
<div ID="helpBox"></div>
</body>
</html>

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 2.0.50727)

calimo · Message par **calimo** » 23 oct. 2007, 18:05

Code : Tout sélectionner

IE4 = (document.all) ? 1 : 0;
NS4 = (document.layers) ? 1 : 0;

Firefox n'est ni IE4 ni NS4 (Netscape 4), donc forcément ça ne peut pas marcher si tu t'y prends ainsi...

En gros tout ton script est basé spécifiquement pour ne fonctionner que sous Netscape 4 et IE 4. Je ne sais pas exactement ce qu'il fait, mais ce qui est sûr, c'est que tu peux le faire de manière bien plus universelle !

PS : c'est du développement web

Invité · Message par **Invité** » 23 oct. 2007, 18:40

effectivement ... parfois les énormités sont invisibles....
bon j'ai nettoyé mais j'ai une erreur sous firevox

Code : Tout sélectionner

<html>
<head>

<!--DEBUT DU CODE ROLLOVER 1-->
<script LANGUAGE="Javascript">

function helpGetOffset(obj, coord) {
    var val = obj["offset"+coord] ;
    if (coord == "Top") val += obj.offsetHeight;
    while ((obj = obj.offsetParent )!=null) {
        val += obj["offset"+coord];
        if (obj.border && obj.border != 0) val++;
    }
    return val;
}

function helpDown () {
    document.all.helpBox.style.visibility = "hidden";
}

function helpOver (event,texte) {

    var ptrObj, ptrLayer;

        ptrObj = event.srcElement;
        ptrLayer = document.getElementById('helpBox');

    if (!ptrObj.onmouseout) ptrObj.onmouseout = helpDown;

    var str = '<DIV CLASS="helpBoxDIV">'+texte+'</DIV>';
        ptrLayer.innerHTML = str;
        ptrLayer.style.top = helpGetOffset (ptrObj,"Top");
        ptrLayer.style.left = helpGetOffset (ptrObj,"Left");
        ptrLayer.style.visibility = "visible";
}</script>

<style TYPE="text/css">
<!--
#helpBox {
    position: absolute;
    z-index: 1000;
    top: 0px;
    left: 0px;
		width:250px;
		
}
DIV.helpBoxDIV {

    padding: 2px;
    background: white;
    border: 1px solid black;

    color: black;
    font-family: Arial,Helvetica;
    font-style: Normal;
    font-weight: Normal;
    font-size: 10px;
    line-height: 14px;
}
-->
</style>
<!--FIN DU CODE ROLLOVER 1-->

</head>
<body>
<br>
<table width=40% border=1 >		
	<tr>
		<td><a onMouseOver="helpOver(event,'Calque affiché')">Passez la souris pour afficher le calque</a></td>
	</tr>
</table>
<div ID="helpBox"></div>
</body>
</html>

ptrObj has no properties
helpOver(mouseover clientX=0, clientY=0, "Calque affiché")b.html (line 28)
onmouseover(mouseover clientX=0, clientY=0)

Merci de m'éclairer
Carlos

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 2.0.50727)

Message par **Benoit** » 23 oct. 2007, 22:58

C'est à cause de son assignation plus haut :

Code : Tout sélectionner

ptrObj = event.srcElement;

Dans Firefox il faut utiliser event.target à la place.

Par exemple comme ceci :

Code : Tout sélectionner

ptrObj = event.target ? event.target : event.srcElement;

Mais il faudra encore remplacer le document.all dans la fonction helpDown().

Invité · Message par **Invité** » 24 oct. 2007, 00:07

merci...

cela fonctionne avec le changement
ptrObj = event.target ? event.target : event.srcElement;

Mais tu dis de changer aussi document.all mais en quoi et pourqoui ?

Merci

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 2.0.50727)

Message par **Benoit** » 24 oct. 2007, 08:45

Par un getElementById() comme tu l'as fait spontanément dans l'autre fonction

Je suppose que ceci suffira :

Code : Tout sélectionner

document.getElementById('helpBox').style.visibility = "hidden";

C'est la fonction que tu assignes pour l'évènement mouseout de ton élément helpBox, donc je suppose que si elle ne fonctionne pas la bulle ne disparaitra pas.

Geckozone

Probleme d'affichage d'un div

Probleme d'affichage d'un div

Qui est en ligne ?