Bonjour à tous,
Voici le but de ma page :
Une image d'une cuisine avec des flèches rouges éparpillées partout.
Un map sur chaque flèches.
Chaque map doit faire apparaître un texte blanc sur fond rouge à côté de la flèche.
Je voudrais éviter de créer autant de div qu'il y a de flèches que cela soit dans la page où dans ma css.
Voici mon problème :
Les div contenant les textes restent bloquer en haut à gauche sous Mozilla alors que sous IE/OPERA il n'y a pas de problème.
Voici mon code :
D'abord la fonction (qui se trouve dans un js) :
Les détections de plates-formes et de navigateur sont dans un autre js et fonctionnent très bien.
Le lien qui se trouve sur un des maps:
Ce qui se trouve dans la feuille de style :
Le DOCTYPE que j'utilise :
Merci d'avance aux personnes qui pourront m'aider.
PS : Lorsque j'enlève le DOCTYPE cela fonctionne bien sur les différents navigateur.
Adresse de la page : http://asmon1.free.fr/xhtml/fiche-produits2.htm
Il n'y a un lien que sur la flèche rouge en haut à gauche.
Modifié par asmon (27 Apr 2006 - 17:52)
Voici le but de ma page :
Une image d'une cuisine avec des flèches rouges éparpillées partout.
Un map sur chaque flèches.
Chaque map doit faire apparaître un texte blanc sur fond rouge à côté de la flèche.
Je voudrais éviter de créer autant de div qu'il y a de flèches que cela soit dans la page où dans ma css.
Voici mon problème :
Les div contenant les textes restent bloquer en haut à gauche sous Mozilla alors que sous IE/OPERA il n'y a pas de problème.
Voici mon code :
D'abord la fonction (qui se trouve dans un js) :
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()
{
var ptrLayer;
ptrLayer = MM_findObj("helpBox");
ptrLayer.style.display = "none";
}
function ViewTxt(event,texte)
{
var ptrObj, ptrLayer;
ptrLayer = MM_findObj("helpBox");
if((Navigateur == "PC" || Navigateur == "MAC") && (Browser == "NETSCAPE" || Browser =="FIREFOX" || Browser =="SAFARI"))
{
ptrObj = event.target;
}
if((Navigateur == "PC" || Navigateur == "MAC") && (Browser == "MSIE" || Browser =="OPERA"))
{
ptrObj = event.srcElement;
}
var str = '<DIV CLASS="helpBoxDIV">'+texte+'</DIV>';
ptrLayer.innerHTML = str;
ptrLayer.bgColor = "#E20026";
ptrLayer.style["top"] = helpGetOffset (ptrObj,"Top")+50;
ptrLayer.style["left"] = helpGetOffset (ptrObj,"Left");
ptrLayer.style.display = "block";
}
Les détections de plates-formes et de navigateur sont dans un autre js et fonctionnent très bien.
Le lien qui se trouve sur un des maps:
onMouseOver="javascript:ViewTxt(event,'Pour faciliter les mouvements, placez les colonnes en bout de linéaire.');" onMouseOut="javascript:helpDown();"
Ce qui se trouve dans la feuille de style :
#helpBox{
position: absolute;
z-index: 1000;
top: 0px;
left: 0px;
width: 160px;
}
.helpBoxDIV{
width: 125px;
margin: 0px 0px 0px 0px;
padding: 5px 5px 5px 5px;
background: #e20026;
color: #ffffff;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
line-height: 10px;
}
Le DOCTYPE que j'utilise :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Merci d'avance aux personnes qui pourront m'aider.
PS : Lorsque j'enlève le DOCTYPE cela fonctionne bien sur les différents navigateur.
Adresse de la page : http://asmon1.free.fr/xhtml/fiche-produits2.htm
Il n'y a un lien que sur la flèche rouge en haut à gauche.
Modifié par asmon (27 Apr 2006 - 17:52)