incompatibilité de navigateurs?
Bonjour,
Je suis débutant en javascript et pas très bon ailleurs non plus !!
Seulement je m'applique la maxime "aide-toi le ciel t'aidera" et je suis breton donc têtu ... mais le ciel était gris ...
Au sortir d'une discussion XHTML/CSS un ami de notre sympathique club m'a fourni le script suivant :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| function hideLayer(sName) {
document.getElementById(sName).style.visibility = "hidden";
}
</script>
<div id="popinfo">
<p id="ferme">
<a href="javascript:hideLayer('popinfo');">Fermer cette fenêtre <span>x</span></a>
</p>
<div id="veut">
<h3>Information</h3>
<p>Aujourd'hui, le résultat n'est pas satisfaisant.<br/>
Mais il y a peut-être mieux. Faites une recherche.</p>
</div>
</div> |
On peut voir le résultat sur http://touteladanse.com/essais/page_2.htm .
SOUS IE7 ça ne fonctionne pas de façon satisfaisante puisque le premier clic fait passer le texte "fermer cette fenêtre" à gauche de la fenêtre et il faut un second clic pour supprimer totalement la fenêtre.
SOUS MOZILLA FIREFOX c'est BON.
J'ai trouvé une autre alternative d'écriture :
Code:
1
2
| function hideLayer(sName) {
document.getElementById(sName).style.display="none"; |
J'obtiens ainsi les mêmes résultats sur les deux navigateurs.
Y a-t-il une explication? Avec Javascript les navigateurs sont-ils toujours aussi facétieux?
Je vous remercie.
Marcel Marie
demain les listings XHTML et CSS
à demain donc pour mise à votre disposition des listes "en cause"!!. Merci.
M.M.M.
plus d'infos sur le script
Bonjour,
Voci comme prévu les deux scripts qui donnent souci ensemble.
On peut se rendre compte de l'effet sur http://touteladanse.com/essais/page_3.htm
Je constate que c'est BON avec Mozilla mais incorrect avec IE7.
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<meta http-equiv="Content-Language" content="fr"/>
<title>Test de positionnement d'une fenêtre.</title>
<meta name="Keywords" content="danse" lang="fr"/>
<link rel="stylesheet" media="screen" type="text/css" title="Mon style Essai 3" href="style_3.css" />
</head>
<body>
<script type="text/javascript">
//les trois alternatives essayées sont ci-dessous
// document.getElementById(sName).style.visibility = "hidden";
//document.getElementById(sName).style.display="none";
//setTimeout(function(){document.getElementById(sName).style.visibility = "hidden"},"200");
function hideLayer(sName) {
setTimeout(function(){document.getElementById(sName).style.visibility = "hidden"},"200");
}
</script>
<div id="popinfo">
<p id="ferme">
<a href="javascript:hideLayer('popinfo');">Fermer cette fenêtre <span>x</span></a>
</p>
<div id="veut">
<h3>Information</h3>
<p>Aujourd'hui, pas terrible !!!. Faites une recherche.</p>
</div>
</div>
<h1>BIENVENUE sur VOTRE SITE, vous les danseurs et danseuses passionnés de danse de salon.</h1>
<p> A Très Bientôt. Merci.</p>
</body>
</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
55
56
57
58
59
60
| h1
{
text-align : center;
color: blue;
}
body
{
background-color: yellow;
}
p
{
font-weight : bold;
}
a:active
{
background-color: lime;
}
a:hover
{
color: red;
font-weight: bold;
}
#popinfo {
position: absolute;
top: 420px;
left: 400px;
/* width: 400px; = largeur
height: 400px; = hauteur */
font-family : Arial, Helvetica, sans-serif;
background-color : #fff;
border : 4px double #000;
}
#ferme {
margin : 0;
text-align : right;
padding : .2em;
background-color : #0131b4;
border-bottom : 1px solid #fff;
}
#ferme a {
color : #fff;
}
#ferme a:hover {
color : #f00;
}
#ferme a span {
padding : 2px 6px;
color : #f00;
background-color : #fff;
}
#veut {
margin : 0;
text-align : center;
color : #e0d;
background-color : #5f4;
overflow : hidden;
}
#veut p {
margin : .5em 1em;
} |
Je vous remercie de regarder où pourrait être l'anomalie, mais n'y passer pas trop de temps.
A bientôt.
Marcel Marie
