SELFHTML

Forum SELFHTML: Archives:
Pseudo-formats et navigateurs

Page d'information: vue d'ensemble
vers le bas 

(CSS) Pseudo-formats et navigateurs

Le message suivant est de: Cédric Pignat, Adresse électronique cedric@pignat.ch, 07. 05. 2004, 12:26
http://www.pignat.ch

Bonjour

Pour donner un effet de bouton-poussoir qui rÃagit au passage de la souris sur les imagettes de mes albums photo, j'ai utilisà les feuilles de style sous la forme suivante:

<style type="text/css">
<!--
a img {border-style:outset;border-color:#6699CC;border-width:4px;}
a img:hover {border-style:inset;border-color:#6699CC;border-width:4px;}
-->
</style>

puis dans le corps de la page:

<a href="photo_1.html"><img src="thumb_bbeaten.jpg" width="56" height="75" alt="Photo NumÃro 1"></a>
<a href="photo_2.html"><img src="thumb_blesine2.jpg" width="56" height="75" alt="Photo NumÃro 2"></a>
<a href="photo_3.html"><img src="thumb_blesine1.jpg" width="56" height="75" alt="Photo NumÃro 3"></a>

L'effet "rollover" fonctionne parfaitement avec Mozilla (l'essayer c'est l'adopter), mais pas du tout avec l'IE de Microsoft
De plus, l'effet ne fonctionne que partiellement avec Netscape: si le curseur est positionnà sur une imagette et que l'on recharge la page (ctrl+r) le bouton paraÃt pressÃ, mais l'effet disparaÃt lorsqu'on dÃplace la souris.

Tant pis pour les utilisateurs de ces navigateurs, mais j'aimerais comprendre... et savoir si une solution existe.

http://www.pignat.ch/albumspeleo/index.html


 
vers le hautvers le bas 

(CSS) Pseudo-formats et navigateurs

Le message suivant est de: Bartouille, Adresse électronique bertrand.wattel_pasDeSpam@free.fr, 07. 05. 2004, 22:07
http://mythes.foret.free.fr

»» Bonjour
Bonjour

»» L'effet "rollover" fonctionne parfaitement avec Mozilla (l'essayer c'est l'adopter), mais pas du tout avec l'IE de Microsoft
»» De plus, l'effet ne fonctionne que partiellement avec Netscape: si le curseur est positionnà sur une imagette et que l'on recharge la page (ctrl+r) le bouton paraÃt pressÃ, mais l'effet disparaÃt lorsqu'on dÃplace la souris.
Selon moi, il s'agit tout simplement d'une histoire d'implÃmentation des pseudo-formats : a img n'est tout simplement pas pris en charge par IE et NS, mais devrait l'Ãtre par la suite.
En tout cas, pour ton problÃme, tu peux te contenter d'utiliser les style de A et A:hover qui est un pseudo-fromat correctement gÃrÃ. Le code suivant devrait te donner plus de satisfactions quelle que soit le navigateur :
<style type="text/css">
<!--
a {border-style:outset;border-color:#6699CC;border-width:4px;}
a:hover {border-style:inset;border-color:#6699CC;border-width:4px;}
-->
</style>

C'est le mÃme, sans les img !

Bartouille


 
vers le haut

© 1998-2004 Adresse électronique selfhtml@fr.selfhtml.org