XHTML/CSS img:hover sans javascript !

Fermé

Utilisateur anonyme - 24 août 2008 à 13:14
RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 - 24 août 2008 à 13:58

Bonjour,
Je souhaiterais donné un effet à une image en utilisant juste du CSS !

Supposons IMG1, au passage de la souris se remplace par IMG2, et revient ensuite IMG1 quand la souris part. Mais je ne veux pas de javascript car le CSS est plus rapide, et mêeme, je ne veux utiliser que xhtml et css ^^

Je voudrais par ailleurs savoir si une telle proprieté existe

.class img:hover {
 src="urldel'image";
}

J'utilise actuellement le onmouse mais je veux rester en CSS pure !

Merci d'avance,
Respectueusement,
Eiewn

A voir également:

XHTML/CSS img:hover sans javascript !
Img burn - Télécharger - Gravure
Fichier img ✓ - Forum Gravure
Href img ✓ - Forum HTML
Buda vfs img ✓ - Forum Virus
Img extractor - Télécharger - Photo & Graphisme

2 réponses

Réponse 1 / 2

RAD ZONE Messages postés 5230 Date d'inscription samedi 20 janvier 2007 Statut Contributeur Dernière intervention 17 août 2024 1 360
24 août 2008 à 13:58

SALUT

voila un petit exemple de rollover image par la methode du bloc qui evite le prechargement de la 2 image , puisque elle ce charge a l ouverture mais en hiden

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xml:lang="fr" xmlns="http://www.w3.org/1999/xhtml" lang="fr">
  <head>
<style type="text/css">
/*<![CDATA[*/
a.images { display: block; width: 100px; height: 30px; background-image: url('2.gif') }
a.images:hover { visibility: visible }
a.images:hover img { visibility: hidden }
/*]]>*/
</style>
<title>images:hover CSS
    </title>
  </head>
  <body>
    <center>
      <a class="images" href="#">
        <img border="0" src="1.gif" /></a>
    </center>
  </body>
</html>

RAD

Réponse 2 / 2

Utilisateur anonyme
24 août 2008 à 13:24

ça ne marche pas, ces valeurs de proprieté n'existe pas apparemment :(

Discussions similaires

ouvrir un fichier .img

trait horizontal avec du css

Enlever le soulignement sous les liens en HTML/CSS

[CSS] Forcé retour à la ligne

HTML - définir taille bouton