Discussion :

[PierreBTSIG]

Voici mon code :
CSS :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
#image
{
        position: absolute;
        margin: 4px;
	border-style: solid;
	border-width: 1px;
	border-color: red;
}
#image:hover
{
	z-index: 100;
}

HTML/PHP :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
list($width, $height, $type, $attr) = getimagesize($_SERVER["DOCUMENT_ROOT"]."/ALEXANDRE/images/entreprise/historique/".$historique['hist_img']); ?>
<img src="/ALEXANDRE/images/entreprise/historique/<?php echo $historique['hist_img'] ?>" height="45" width="50" OnMouseOut="javascript:this.height = 45; this.width = 50" OnMouseOver="javascript:this.height = <?php echo $height; ?>; this.width = <?php echo $width; ?>" id="image">

Au départ, l'image est normale et lorsque je passe dessus, je voudrais la voir en agrandit.
Sous firefox sa fonctionne : l'image s'agrandit et grace au css elle passe au dessus de tout le reste (z-index)

Par contre sous IE l'image ne passe pas au dessus des cadres en dessous de l'image agrandie (voir screen) :


Merci à tous pour votre aide.

PS : Si quelqu'un sait comment augmenter la taille d'un div en fonction du texte qu'il contient merci aussi (j'ai déjà utiliser cette méthode : http://batraciens.net/css-astuces/3-...aptables-1.htm
Pour le corps de mon site mais cela ne semble pas fonctionner pour mes cadres !!)

[orphen]

Je ne sais pas si cela réglera ton problème mais ie6 préférera que tu lui rappel la position absolute sur ton hover.

a ++

[Erwan31]

Bonjour,
tu dois penser à préciser sur quelle version d'IE ça pose problème
et ne donner que le code interprété et non PHP.

A priori c'est sur IE6 qui ne gère pas les pseudo-classes dynamiques (:hover, :focus...) sur tous les éléments excepté les liens, ce qui fait que le z-index n'est
pas pris en compte et que tu dois donc l'implémenter via javascript.

[PierreBTSIG]

Je possède la version 7 de IE. Mais de toute facon c'est sur que le :hovre est prit en compte car si je change le cadre de ma photo en bleu par éxemple, pour le :hovre, IE le prend en compte au survol de l'image !!

[razorlok]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<div class="zoom">
<img src="/ALEXANDRE/images/entreprise/historique/<?php echo $historique['hist_img'] ?>" height="45" width="50">
</div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
.zoom {
height:400px;
margin:auto;
}
.zoom img {
width:300px;
height:225px;
}
.zoom img:hover {
width:400px;
height:300px;
}

Un truc comme ça ca marcherait pas mieux que ton java ?

[PierreBTSIG]

Non désolé mais sa ne marche pas non plus
De plus je suis obligé de gérer cette action avec du javascript car il me faut la taille réelle de l'image !!

Edit : En fait c'est bon : les cadre qui passaient au dessus de mon image était en position : relative; j'ai simplement supprimé cette ligne !!

[Erwan31]

Ok.

Je possède la version 7 de IE. Mais de toute facon c'est sur que le :hovre est prit en compte car si je change le cadre de ma photo en bleu par éxemple, pour le :hovre, IE le prend en compte au survol de l'image !!

Il fonctionne sur IE7 mais pas sur IE6

[razorlok]

Je possède la version 7 de IE. Mais de toute facon c'est sur que le :hovre est prit en compte car si je change le cadre de ma photo en bleu par éxemple, pour le :hovre, IE le prend en compte au survol de l'image !!

Ca c'est sur, le :hovre ne risque pas d'être pris en compte, que ce soit IE, Mozilla, Opera et les autres

[PierreBTSIG]

A oui en effet j'avais pas vu m'a faute ... à quand les navigateur qui corriges automatiquement les fautes de frappes dans le code ??