Code CSS : Les Images coulissantes

Avec deux images

Avec deux images De même taille

Ex 1 : Saint-Pierre/Murène

Avec deux images de tailles différentes

Ex 2 : Chapon

Ex 3 : Denti, deux images de tailles différentes avec positionnement absolu

Comme dans l'exemple 2bis du tuto, il faut qu'au survol, votre image vienne recouvrir ce texte sans le déplacer.

Et il serait "classe" que l'image survolée soit centrée sans que la vignette ne se déplace.

La solution : il faut que la vignette soit calée par une marge gauche identique à celle de l'image principale centrée. Je vous laisse le plaisir de faire le calcul.

Avec une seule image

Ex 4 : Merou (Deux images de même taille)

Ex5 : Homard (Deux images de tailles différentes, coulissement vertical)

Ex 5 : Langouste (Deux images de tailles différentes, coulissement horizontal)

Ex 7 : Deux images de tailles différentes,
background-image paramètrable
(Même code CSS pour les deux images)

MENU Horizontal AVEC DES IMAGES COULISSANTES

IMage survolée déportée

Tortue