Dans ce tuto Jquery en vidéo, nous verrons comment créer une lightbox pour vos images. Une lightbox, si vous ne le savez pas, est une popup qui s'ouvre lorsque l'on clique sur une image pour la voir en plus grand. En quelques lignes de code, nous arriverons à créer ce système simplement. Bien entendu, ce n'est qu'un début de code, et le système peut être amélioré selon vos projets.

Déroulement de ce tuto Lightbox Jquery :

• Petit tour sur le résultat du tuto
• Insertion des images
• Création des liens sur ces images
• Création de la lightbox en HTML/CSS pour voir le rendu
• Lier notre fichier HTML à Jquery
• Créer et lier un fichier javascript externe
• Taper notre code Jquery dans ce fichier
• Tester pas à pas notre système
• Récupérer le title du lien dans notre lightbox
• Ajouter un effet d'apparition en fade à la lightbox

Beaucoup de scripts de Lightbox existent sur la toile aujourd'hui, mais vous saurez maintenant comment cela fonctionne, et si vous n'avez pas forcément envie d'utiliser un script assez lourd, vous pourrez créer votre propre lightbox adapté à vos besoins.
Le fichier HTML, la feuille de style CSS, et le fichier JS sont fournis dans les sources pour que vous puissiez reproduire le système de lightbox sur votre site.. Bon tuto à tous !