:target - Galerie
En cliquant sur les liens, vous naviguez entre les différentes images, tout ceci en un minimum de code et sans JavaScript ni PHP.
Conseils de mise en oeuvre
- La première étape est la création de la série d'images et leurs numéros, ceux-ci étant des liens. J'ai travaillé avec des figure (images) et figcaption (liens).
- Chaque figure a besoin d'un id, cela permettra l'utilisation d'une ancre, le lien href pointant vers l'id de la figure qui le contient. Cela permet à :target de fonctionner.
- Toutes les images sont positionnées les unes par dessus les autres. En utilisant le sélecteur, nous changeons uniquement la valeur de la propriété z-index, et l'image cible se positionne au-dessus des autres images