Effet CSS lorsque l'on clique sur une image (comme ci-dessus)

Bonjour tout le monde,

Sur cette page, ci-dessus, quand vous passez votre souris sur l'icone APPRENDRE ou FORUM, vous voyez qu'il y a un fond blanc qui apparaît.

Est-ce quelqu'un saurait me dire si c'est compliqué à faire ?

Existe-t-il un tuto pour faire cela ?

Ne connaissant pas le nom de cette méthode, j'ai du mal à chercher un tuto.

Merci d'avance.

beegees

Rebonjour

Je ne connais pas la méthode utilisée par Alsacréation, mais tu peux utiliser chercher autour de :hover.

Il existe quelques attributs "événementiels" qui te permettent, en html/css, de gérer ce type d'effets. ici, par exemple, pour une div au pif:

.aupif
{
      background: url("img/image_simple.png");
}

.aupif:hover
{
      background: url("img/image_simple_plus_fond_blanc.png");
}

ceci permet d'avoir une image de fond permanente, qui change uniquement si tu passes ta souris devant cette même image.

Je te conseille aussi "firebug", un petit module firefox qui te permet d'explorer html et css (entre autre) présents sur les pages web. De cette manière, tu pourras observer les méthodes utilisées sur les sites internet, trouver celle qui te plait et mieux orienter tes recherches.
Modifié par lautrejojo (27 Dec 2009 - 15:27)

Re-bonjour,

Merci pour ta réponse

J'avais pensé au hover et au fait d'afficher une autre photo au survol de la souris.

J'ai surtout posté pour voir si il existait une méthode toute faite en CSS.

Concernant firebug, c'est le plugin j'ai le plus utilisé ces 18 derniers mois, j'ai juste pas pensé à l'utiliser pour "explorer" le site d'alsacréation.

Je dois t'avouer que j'utilise firebug principalement pour qu'il détecte mes erreurs dans mon code, cela m'aide énormément.

Je l'utilise aussi pour "explorer" mes propres sites afin de voir si le code généré est correct.

Encore merci.

beegees

Oups, désolé... à lire ta question ça ne m'a pas sauté aux yeux. J'espère que tu n'y as pas vu de condescendance : n'ayant pas bien compris le contexte, j'ai expliqué comme à un grand débutant.

beegees a écrit :

J'ai surtout posté pour voir si il existait une méthode toute faite en CSS.

Pour ma part, je n'en connais pas d'autre que :hover en full css.
Modifié par lautrejojo (27 Dec 2009 - 15:43)