lightGallery version 2 has been released. Please upgrade

# Html Markup.

LightGallery does not force you to use any kind on markup. You can use almost any king of markup with the help of `selector` setting.

#### HTML structure

    <div id="anchor-tag">
      <a href="img/img1.jpg">
          <img src="img/thumb1.jpg" />
      </a>
      <a href="img/img2.jpg">
          <img src="img/thumb2.jpg" />
      </a>
      ...
    </div>

#### Javascript

    $('#anchor-tag').lightGallery();

#### HTML structure

    <ul id="ul-li">
      <li data-src="img/img1.jpg">
          <img src="img/thumb1.jpg" />
      </li>
      <li data-src="img/img2.jpg">
          <img src="img/thumb2.jpg" />
      </li>
      ...
    </ul>

#### Javascript

    $('#ul-li').lightGallery();

#### HTML structure

    <div id="selector1">
      <h2>Gallery title</h3>
      <div class="item" data-src="img/img1.jpg">
          <img src="img/thumb1.jpg" />
      </div>
      <div class="item" data-src="img/img2.jpg">
          <img src="img/thumb2.jpg" />
      </div>
      ...
    </div>

#### Javascript

    $('#selector1').lightGallery({
        selector: '.item'
    });

#### HTML structure

    <a id="selector2" href="img/img1.jpg">
        Click to open
    </a>

#### Javascript

    $('#selector2').lightGallery({
        selector: 'this'
    });

## More demos

Thumbnails
Youtube/Vimeo Videos
HTML5 Videos
Transitions
Dynamic
Events
Methods
Iframe
Captions
Responsive
fixed Size
Html Markup
Comment box
Easing
Hash plugin
Share