zoom sous ie7 / images

**kohsaka** · 07/08/2008, 20h06

bon tout d'abord excusez moi, ce n'est peut être pas le meilleur endroit pour ma question, mais elle est lié au css tout de même.

bref, j'ai toujours était certain que ie7 n'était pas capable de zoomer les images lors d'un simple ctrl +. le site que je développe actuellement me confirme d'ailleurs cela. cependant j'ai trouvé plusieurs sites ou les images (notamment le background-image du body) était zoomé sous ie7.

alors, javascript ou une solution css que j'aurais manqué ?

je vous remercie pour votre aide :)

**laurentibus** · 08/08/2008, 10h20

ouais avec JS tu peux simuler un zoom en modifiant les attributs css width et height de ton image :
ex pour une image zommer au passage de la souris :

Code :

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

1
2
 
<img src="Image" width="200" height="200" OnMouseOver="this.style.height='400';this.style.width='400';" OnMouseOut="this.style.height='200';this.style.width='200';"/>

voila apres il te reste a faire cela avec crtl + ( enfin comme tu le souhaite ... )

ps : marche sous IE et FF

**kohsaka** · 08/08/2008, 20h07

merci pour ta réponse.
je vais voir pour faire ça.

**kohsaka** · 09/08/2008, 23h13

hello tout le monde, c'est encore moi, j'ai réfléchi au problème et j'ai trouvé la parade pour ne pas passé par du JS.
en fait ie7 agrandi tout seul les images du design, sauf si c'est une image qui est appliquée au body.

donc au lieu de faire ceci :

Code :

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

1
2
3
4
5
6
7
 
body {
    margin: 0; /* pour éviter les marges */
    text-align: center; /* pour corriger le bug de centrage IE */
    font-family: Verdana, Arial, Helvetica, sans-serif;
    background: #FFFFFF url(layout/fond.jpg) repeat-x;
}

faites ceci

Code :

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

1
2
3
4
5
6
7
8
9
 
#fond {
    position: absolute;
    left: 0;
    width: 100%;
    height: 150px; /* taille du fond */
    background: #FFFFFF url(layout/fond.jpg) repeat-x;
    z-index: -10;
}

code html

Code :

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

1
2
3
4
5
6
7
 
<body>
	<div id="fond"></div>
	<div id="container">
        ...
        </div>
</body>

**kohsaka** · 10/08/2008, 00h50

zut, en fait ça pose un léger problème quand on zoom trop

et là le problème se produit sur ie7 et FF (bien que les pb ne soit pas similaire bien sur).

voila une page pour illustrer les problèmes :
fond ext sur ie7 et FF

j'ai essayé aussi ceci :

Code :

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

1
2
3
4
5
6
7
8
9
 
 #fond {
  position: static
  height: x;
}
 
 #container {
  margin-top: -x;
}

ça règle le problème sur ie (sans être parfait), mais ca ne change rien sous FF (quand on zoom excessivement).

et désolé pour le monologue =']

**laurentibus** · 11/08/2008, 09h53

sous FF3 je vois pas le pb ... peut etre parce que je vois pas d images

...

**kohsaka** · 11/08/2008, 13h42

image en repeat-x

le problème est assez subtil, j'ai mis une image en pièce jointe pour que tu constates ce que j'obtiens.

malgré ce problème, je pense que ça reste le meilleur compromis.