Reputation: 2126
I have a bootstrap page and I downloaded jquery plugin (lightgallery.js) and plugins works very well with theese codes;
<div class="item active" id="lightgallery">
<a href="http://s.fotorama.io/1.jpg">
<img src="http://s.fotorama.io/1.jpg" alt="...">
</a>
<a href="http://s.fotorama.io/2.jpg">
<img src="http://s.fotorama.io/2.jpg" alt="...">
</a>
</div>
and this is my jquery function to work plugin
$('#lightgallery').lightGallery();
it's good but if I change my html structure plugin is not work
my html structure is below;
<div id="lightgallery">
<div class="item active">
<a href="http://s.fotorama.io/1.jpg">
<img src="http://s.fotorama.io/1.jpg" alt="...">
</a>
</div>
<div class="item">
<a href="http://s.fotorama.io/2.jpg">
<img src="http://s.fotorama.io/2.jpg" alt="...">
</a>
</div>
</div>
Upvotes: 0
Views: 245
Reputation: 23389
Use a list like this..
<ul id="lightgallery">
<li class="item active">
<a href="http://s.fotorama.io/1.jpg">
<img src="http://s.fotorama.io/1.jpg">
</a>
</li>
<li class="item">
<a href="http://s.fotorama.io/2.jpg">
<img src="http://s.fotorama.io/2.jpg">
</a>
</li>
</ul>
Upvotes: 1