integration sous IE et sous Mozilla
Bonjour à tous,
Je suis en train de creer un site web statique en HTML et javaScript.
Ma page principal est un cadre avec un menu en javascript (que j'appel !).
Mon souci vient du fait que je n'arrive pas à positionner ce menu à la bonne place. Il se place correctement sous IE mais mal sous Mozilla.
Si quelqu'un peut m'aider.
Voici le menu. (recuperer sur le net et completer par moi !)
menu.js
Code:
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
|
//************ Menu Principal ************//
Color0M = '#FC7613' //Couleur du texte orange
Color1M = '#577b8b' //Couleur Arrière gris foncé
Color2M = '#CCCCCC' //Couleur Arrière Surbrillance gris clair
Color3M = '#CCCCCC' //Couleur Bordure gris clair
PosY = 500 //Distance entre le haut de l'écran et le menu
LargeurM = 110 //Largeur
HauteurM = 30 //Hauteur
AlignM = 'center' //'center','right','left'
FontM = 'Arial' //Police
SizeM = 12 //Taille de la Police
WeightM = 'bold' //Epaisseur de la Police
CursorM = 'default' //Curseur-> default,hand...
menu = new Array
i=0
//--------[Texte/Html]------------------[ Adresse ]--------------------------//
menu[i++]='About Us' ;menu[i++]='#'
menu[i++]='Solutions' ;menu[i++]='#'
menu[i++]='Products' ;menu[i++]='#'
menu[i++]='Partners' ;menu[i++]='#'
menu[i++]='Resellers' ;menu[i++]='#'
menu[i++]='Support' ;menu[i++]='#'
menu[i++]='Contact' ;menu[i++]='#'
//************ Sous-Menus ************//
Color0S = '#000000' //Couleur du texte
Color1S = '#CCCCCC' //Couleur Arrière
Color2S = '#999999' //Couleur Arrière Surbrillance
Color3S = '#CCCCCC' //Couleur Bordure
EnLigne = 0 //1:pour ranger sur une seule ligne 0:en colonne
LargeurS = 110 //Largeur
HauteurS = 20 //Hauteur
AlignS = 'center' //'center','right','left'
FontS = 'Arial' //Police
SizeS = 10 //Taille de la Police
WeightS = 'bold' //Epaisseur de la Police
FonduS = 1 //1:Fondu, 0:aucun
CursorS = 'default' //Curseur-> default,hand...
k=-1; zlien=new Array
i=0; zlien[++k]=new Array
//------------[Texte/Html]------------------[ Adresse ]-------------------------------//
zlien[k][i++]='News';zlien[k] [i++]=''
i=0; zlien[++k]=new Array
i=0; zlien[++k]=new Array
i=0; zlien[++k]=new Array
i=0; zlien[++k]=new Array
i=0; zlien[++k]=new Array
i=0; zlien[++k]=new Array
//************ Fin des paramètres, Début du programme ************//
document.write('<style>')
document.write('.ejmenu {background:'+Color1M+';text-align:'+AlignM+';font:'+WeightM+' '+SizeM+' '+FontM+';color:'+Color0M+';cursor:'+CursorM+'}')
document.write('.ejsmenu {background:'+Color1S+';text-align:'+AlignS+';font:'+WeightS+' '+SizeS+' '+FontS+';color:'+Color0S+';cursor:'+CursorS+'}')
document.write('</style>')
function fadeIn(obj)
{ obj.style.filter="blendTrans(duration=1)"
if(obj.filters.blendTrans.status!=1)
{ obj.filters.blendTrans.Apply()
obj.style.visibility="visible"
obj.filters.blendTrans.Play()
}
}
document.onclick = function() { skn.visibility='hidden' }
//document.onmousemove = function() { dgt.top=document.body.scrollTop+PosY; dgt.visibility='visible' }
//window.onscroll = function() { dgt.visibility=skn.visibility='hidden' }
function pop(msg,pos)
{ skn.visibility="hidden"
skn.top= HauteurM
if(!msg.length) return
if(EnLigne)
{ content="<TABLE style='border-collapse:collapse;'WIDTH="+LargeurM*menu.length/2+" bordercolor="+Color3S+" BORDER=1><TR>"
for(pass=0;pass<msg.length;pass+=2) content+="<TD onMouseDown='location.href=\""+msg[pass+1]+"\"' onMouseOver=\"this.style.background='"+Color2S+"'\" onMouseOut=\"this.style.background='"+Color1S+"'\" HEIGHT="+HauteurS+" CLASS=ejsmenu>"+msg[pass]+"</TD>"
} else
{ skn.left=pos-1
content="<TABLE style='border-collapse:collapse;'WIDTH="+LargeurS+" bordercolor="+Color3S+" BORDER=1>"
for(pass=0;pass<msg.length;pass+=2) content+="<TR><TD WIDTH="+LargeurS+" onMouseDown='location.href=\""+msg[pass+1]+"\"' onMouseOver=\"this.style.background='"+Color2S+"'\" onMouseOut=\"this.style.background='"+Color1S+"'\" HEIGHT="+HauteurS+" CLASS=ejsmenu>"+msg[pass]+"</TD></TR>"
}
document.getElementById("topdeck").innerHTML=content+"</TR></TABLE>"
if(document.all && FonduS) fadeIn(topdeck); else skn.visibility="visible";
}
document.write('<DIV style="position:relative"><DIV style="POSITION:absolute;VISIBILITY:hidden;z-index:15" id=topdeck></DIV><TABLE ID=topmenu style="position:absolute;border-collapse:collapse;" bordercolor='+Color3M+' BORDER=1 WIDTH='+LargeurM*menu.length/2 +' HEIGHT='+HauteurM+'><tr>')
skn=document.getElementById('topdeck').style
//dgt=document.getElementById('topmenu').style
for(pass=0;pass<menu.length/2;pass++) document.write("<TD WIDTH="+LargeurM+" onMouseDown='location.href=\""+menu[pass*2+1]+"\"' onMouseOver='this.style.background=\""+Color2M+"\";pop(zlien["+pass+"],this.offsetLeft)' onMouseOut='this.style.background=\""+Color1M+"\"' CLASS=ejmenu>"+menu[pass*2]+"</TD>")
document.write('</TR></TABLE></DIV>')
//dgt.top=document.body.scrollTop+PosY |
Et voici ma page html : index.html
Code:
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
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Page d'accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<br>
<div align="center">
<table width="90%" height="600" border="1" cellpadding="0" cellspacing="0" bordercolor="#666666">
<tr height="600">
<td>
<table width="100%" height="600" border="0" cellpadding="0" cellspacing="0" bordercolor="#666666">
<tr height="50">
<td width="20%" height="50"rowspan="3" bgcolor="#577b8b"><div align="center"><img src="images/logo.jpg" width="154" height="100" align="top" /></div></td>
<td width="80%" height="40" bgcolor="577b8b" border="0"> </td>
</tr>
<tr>
<td height="21" bgcolor="577b8b" border="0">
<script language="JavaScript" src="menu.js" type="text/JavaScript"></script></td>
</tr>
<tr height="50">
<td height="21" bgcolor="577b8b" border="0"> </td>
</tr>
<tr height="450">
<td>
<table height="100%" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="375"style="background-image:url(images/left_bg.jpg)">
</td>
</tr>
<tr>
<td height="75"style="background-image:url(images/left_bg_bt.jpg)">
</td>
</tr>
</table>
</td>
<td > </td>
</tr>
<tr height="50">
<td bgcolor="#abc3cf"> </td>
<td bgcolor="#abc3cf"> </td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html> |
Dans le HTML, le javascript est introduit par :
Code:
1
2
3
4
5
|
<tr>
<td height="21" bgcolor="577b8b" border="0">
<script language="JavaScript" src="menu.js" type="text/JavaScript"></script></td>
</tr> |
Si quelqu'un peut me dire comment bien positionner mon menu, merci d'avance !!!:mrgreen::mrgreen::mrgreen:
