Bug d'affichage ancienne version de firefox ou internet explorer
Bonjour à tous.
Voila, je rencontre un soucis avec un des site dont je m'occuper.
En effet, j'ai fait un album photo en AJAX qui, lorsque quelqu'un clique sur une maniature, une div devient visible (avec une transparence de 70 et une couleur de fond) et une deuxième contient l'image. Un clic sur l'image rend ces deux div invisibles.
Pour ceux qui veulent voir, il s'agit de http://cpc.plongees.fr
Voici les deux css pour les 2 div :
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
| .photo_masque{
position: absolute;
display: none;
background-color: #00246B;
width: 100%;
height: 100%;
text-align: center;
top: 0px;
left: 0px;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
overflow: hidden;
z-index: 2;
}
.photo{
width: 100%;
height: 100%;
position: absolute;
display: none;
top: 0px;
left: 0px;
text-align: center;
z-index: 3;
background-image: url(pics/loader_photo.gif);
background-repeat: no-repeat;
background-position: top;
} |
Les layers sont donc bien en superposition de la page avec un affichage d'abord du "masque" (non géré sur les anciennes versions mais pas dramatique) et au dessus l'image.
(d'abord hidden puis affiché en javascript!)
Sur les nouvelles version des browser (firefox ou ie 7), ca fonctionne impeccable, l'image est centrée horizontalement. Par contre sur les anciennes versions, l'image se trouve en haut a gauche, ce qui gache un peu l'effet !
Y a t'il une solution miracle ?
