30 décembre 2006
Bibliothèque lightbox
Comme je vous l'ai promis, je vais vous présenter la bibliothèque lightbox. La plupart d'entre vous ne la connaissent pas. C'est une bibliothèque (comprenez application) web qui permet d'afficher des images en plus grandes sans ouvrir une nouvelle page. Il fonctionne sous tous les navigateurs modernes et il est très petit et facile à utiliser.
Voici un exemple :
Si vous souhaitez installer cet outil sur votre site/blog. Voilà ce qu'il faut faire :
Tout d'abord, récupéré ce fichier :
Lightbox JS v2.02
Copier les fichier sur votre site.
Ensuite, placer ces lignes de code entre <head> et </head>.
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
Dans "src=", il faut renvoyer à l'adresse des fichiers.
- Puis il faut copier les lignes de codes de lightbox.css dans le fichier css de votre site.
- Puis copier cette ligne entre <head> et </head> : <link rel="stylesheet" xhref="css/lightbox.css" type="text/css" media="screen" />
Voila votre site est pret.
Maintenant lorsque vous voulez afficher une image placer le code :
<a href="adresse de l'image" rel="lightbox" title="TItre de l'image"><img src="adresse de l'image
" alt=" height="hauteur" width="largeur"></a>
Si vous ne voulez pas de miniature mais juste un texte comme pour mon exemple voici le code :
<a href="adresse de l'image" rel="lightbox" title="TItre de l'image">Texte lien</a>
Si vous avez des questions n'hésitez pas.
Commentaires
Poster un commentaire
Rétroliens
URL pour faire un rétrolien vers ce message :
http://www.canalblog.com/cf/fe/tb/?bid=98222&pid=3554560
Liens vers des weblogs qui référencent ce message :