Etonnants effets CSS3 style LightBox

Rédigé par Daniel - 10 avril 2012

Une reprise de l'effet Lightbox mais sans Jquery et avec les nouvelles technologies CSS.

J'ai voulu cette fois reprendre "simplement" la technique Lightbox très utilisée pour afficher une image au clic en zoomant.

Le principe est un peu le même que pour la galerie zoom, mais cette fois il faut donner le focus à l'élément pour avoir l'action au clic et non pas au survol.

Pour cela il faut déclarer un positionnement tabindex qui modifie généralement l'ordre de la tabulation au clavier, mais va nous servir à prendre le focus:

tabindex="0"

Sans cette déclaration cela ne fonctionnera pas

Mon code est assez court et d'autres on repris exactement l'effet Lightbox en CSS3 mais avec un code assez long et compliqué en production
L'idée est ici de faire au plus simple et d'avoir un rendu assez sympathique pour quelques images à présenter

Enjoy!

Développement - Mots clés : CSS3

• joelle

  mardi 17 avril 2012 à 13:56

  C'est du pain béni pour les novices comme moi ! Mais j'ai encore beaucoup à apprendre :/
  
  joelle

Les commentaires sont fermés.