jQuery Popeye 2.0 — Une Lightbox inline

Popeye 2.0 est une lightbox qui affiche une galerie d’images à partir d’une liste non-ordonnée dans le flux de votre texte. Le marquage HTML est à votre discrétion à condition d’utiliser les classes CSS prévues par le script. Il est possible d’afficher une légende par image en enveloppant le texte de votre choix avec l’élément span.

Exemple

Le marquage HTML

<div id="ID_CAN_BE_USED_TO_START_POPEYE_SCRIPT">
    <ul>
        <li><a href="URL_OF_BIG_IMAGE"><img src="URL_OF_THUMBNAIL" alt="CAPTION_STRING" /></a></li>
        <li>...</li>
    </ul>
    <div>
        <div>
            <div>
                <strong></strong> / <strong></strong>
            </div>
        </div>
        <div>
            <a title="Next image">Next image</a>
            <a title="Previous image">Previous image</a>
            <a title="Enlarge">Enlarge</a>
            <a title="Close">Close</a>
        </div>
    </div>
</div>

L’appel du script

$(document).ready(function () {
    $(YOUR_ELEMENT_SELECTOR).popeye();
});

A vous de jouer