Lightbox2 ne pas initier

Question

Ok, donc ce que je pensais me prendre quelques minutes à mettre en œuvre a maintenant pris plus d'une heure de mon temps et je suis juste complètement intrigué. J'ai téléchargé lightbox2, suivi les instructions; intégrer leur CSS et JS dans la tête de mon index.html

<link href="lightbox/lightbox.css" rel="stylesheet"> 
<script src="lightbox/lightbox-plus-jquery.js"></script> 

Je suis sur localhost testais si cela fait une différence. Les chemins sont correctement réglés à 100% et sont donc les chemins vers les 4 images CSS nécessite ..

Maintenant, dans mon corps, je me sers du a href avec l'attribut data-lightbox comme celui-ci

<a class="example-image-link" href="gallery/i1.jpg" data-lightbox="group" data-title="Optional caption."> 
    <img class="example-image" src="gallery/i1.jpg" alt="desc"> 
</a> 
<a class="example-image-link" href="gallery/i2.jpg" data-lightbox="group" data-title="Optional caption."> 
    <img class="example-image" src="gallery/i2.jpg" alt="desc"> 
</a> 

Il y a rien d'autre sur la page de sorte que le résultat ressemble à ceci:

le problème est que lorsque je clique sur l'une des images, au lieu de la visionneuse popping l'image ouvre juste dans un onglet plein écran. C'est comme si la visionneuse ne fonctionnait pas du tout, et il suit juste le a href à l'image .. J'ai même essayé JSFiddle et chargé le même CSS et JS comme ressources externes et il fait exactement la même chose. Voyez par vous-mêmes ->JSFIDDLE

Je suis ouvert à toutes les idées .. Je ne comprends vraiment pas ce qui me manque.

Answer 1

Vous devez déplacer le bit <script src="lightbox/lightbox-plus-jquery.js"></script> à la fin de votre balise body dans le code HTML au lieu du head. Le problème est que si le script est dans la tête, il s'exécutera avant que les images soient prêtes à être analysées par la bibliothèque.