It would be great if the custom font could be provided in woff2 format as well, as it is supported by most browsers and is more efficient than woff (and so should be the preferred format for supporting browsers)

<!-- data-src should not be provided when you use html5 videos -->
<ul id="html5-videos">
  <li data-poster="video-poster1.jpg" data-sub-html="video caption1" data-html="#video1" >
      <img src="img/thumb1.jpg" />
  </li>
  <li data-poster="video-poster2.jpg" data-sub-html="video caption2" data-html="#video2" >
      <img src="img/thumb2.jpg" />
  </li>
</ul>

First off, thanks for the awesome plugin, and rewriting it without dependencies.

I am using the lightgallery portion successfully, but am unable to get the plugins working. I am trying to use lg-zoom.js and lg-fullscreen.js. I tried the nested requires like you had an example of to no success. I have tried several methods of using webpack loaders for exporting or importing variables into the module. If you or any other users have an idea on how to fix this it would be greatly appreciated.

My setup looks like

require('lightgallery.js');
require('lg-zoom.js');
require('lg-pager.js');
require('lg-fullscreen.js');

export default (function () {
  $('document').ready(() => {
    lightgallery($('#lightgallery')[0]);

    $('.dwnld').click(function(ev) {
      ev.preventDefault();
      $(this).text('Preparing Download…');
      var $form = $('#download-form');
      $form.submit();
    });
  });
})();

Hi, How i can change default video.js size when i click on video its open but is small i want min-width: 100% to make it on full window and keep proportion. I cannot find it on css file Thank you

I tried to fix it myself but I can't checkout the gh-pages branch on Windows.

xmr@xmr-PC ~
$ cd /c/Users/xmr/Desktop/lightgallery.js/

xmr@xmr-PC /c/Users/xmr/Desktop/lightgallery.js
$ git checkout -b gh-pages remotes/origin/gh-pages
fatal: cannot create directory at 'lightgallery/sass/C:': Invalid argument

The fix should be pretty easy; just use https for all links and scripts.

Need merge 2 gallery in one output...

add gallery 1

im use code

require(["jquery", "lightgallery"], function () { require(["lg-thumbnail", "lg-fullscreen"], function () {

            lightGallery(document.getElementById("lightgallery"), {
                selector: ".lg-item a"
            });

        });

});

I'm setting up lightgallery.js for a website and am running into an issue with it using version 0.0.3.

The error message is:

Uncaught TypeError: Cannot read property 'match' of null

Running the non-minified script fails at line 638, which contains:

var youtube = src.match(/\/\/(?:www\.)?youtu(?:\.be|be\.com)\/(?:watch\?v=|embed\/)?([a-z0-9\-\_\%]+)/i);

Here's the relevant markup (which uses the Pure CSS framework):

<section class="content">
  <h1 class="text-centered">Gallery</h1>
  <div id="lightgallery" class="pure-g">
    <div class="pure-u-1 pure-u-sm-1-2">
      <a href="/media/gallery/1.jpg">
        <img src="/media/gallery/1.jpg" class="pure-img">
      </a>
    </div>
    <div class="pure-u-1 pure-u-sm-1-2">
      <a href="/media/gallery/2.jpg">
        <img src="/media/gallery/2.jpg" class="pure-img" >
      </a>
    </div>
    <div class="pure-u-1 pure-u-sm-1-2">
      <a href="/media/gallery/3.jpg">
        <img src="/media/gallery/3.jpg" class="pure-img" >
      </a>
    </div>
    <div class="pure-u-1 pure-u-sm-1-2">
      <a href="/media/gallery/4.jpg">
        <img src="/media/gallery/4.jpg" class="pure-img" >
      </a>
    </div>
  </div>
</section>

And the JavaScript used to initialize it:

<script src="/assets/js/lightgallery.js"></script>
<script>
  lightGallery(document.getElementById('lightgallery'));
</script>

I'm not using any other JavaScript files on that site, not even jQuery. Note that it used to work for a small while, but I can't remember why.

I can reproduce this behavior with both Chromium 52 and Firefox 48.

I am trying to import this into React. I keep getting an empty object. I am not sure if I am doing it incorrectly or if there is an issue.

import lightGallery from 'lightgallery.js';
console.log(lightGallery); // returns Object {}

thanks

Fixes #53. Also correcting typos in README.md

Additionally, please update dist/css after the merge, so people using bower etc may profit from the changes. If there's anything else, let me know, and thanks for this great library. Cheers!

Problem If you are using lightgallery.js with google maps on the same page (both libraries included) and want to use Google Maps Street View you will not be able to, because the lightgallery hardcoded functions for "getAttribute" and "setAttribute" on window and document will conflict with Google Maps Street View

Request Remove these functions from window and document and use a util function instead.

Pull Request already added to #68

Hi, I'm currently building a website and using lightGallery in combination with Justified Gallery. I ran into a problem when filtering images and therefore destroying and reinitialize lightGallery with the remaining pictures.

As long as I haven't clicked on a picture or so to speak opened the gallery, the gallery gets correctly destroyed and repopulated with the remaining pictures after filtering (let's say with architecture-pictures). But clicking on any pictures before filtering leads to this.thumbOuter.parentNode is null in lg-thumbnail.min.js:7:8883.

I initialize the gallery as follows:

$(document).ready(function() {
    var gallery = document.getElementById('lightgallery');
    lightGallery(gallery, {
        selector: ".itemlg",
        mode: "lg-fade",
        hideBarsDelay: 1000
    });
});

Then filtering by clicking on a button.

$(document).ready(function() {
    $(this).on("click", "#architecture", function() {
        //causes the error
        window.lgData[gallery.getAttribute("lg-uid")].destroy(true);

        jQuery("#mygallery").justifiedGallery({
            filter: ".architecture",
        });

        gallery = document.getElementById('lightgallery');
        lightGallery(gallery, {
            selector: ".architecture",
            mode: "lg-fade",
            hideBarsDelay: 1000
        });
    });
});

I don't think that's intended. Or maybe I missed a point.

Bumps decode-uri-component from 0.2.0 to 0.2.2.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.