javascriptjqueryhtmlgallerylightgallery

Multiple galleries in Lightgallery hash plugin?


I cannot run the plugin Lightgallery hash. My wish is to have two galleries on the same page and clicking on a button should display the other. If I'm not mistaken the plugin should do this.

I added this HTML structure:

<div id="hash">
<a href="img/img_port/reportage/img-1.jpg">
    <img src="img/img_port/reportage/thumb-1.jpg" />
</a>
<a href="img/img_port/reportage/img-2.jpg">
    <img src="img/img_port/reportage/thumb-2.jpg" />
</a>
<a href="img/img_port/reportage/img-3.jpg">
    <img src="img/img_port/reportage/thumb-3.jpg" />
</a>
<a href="img/img_port/reportage/img-4.jpg">
    <img src="img/img_port/reportage/thumb-4.jpg" />
</a>

<div id="hash2">   
<a href="img/img_port/reportage/img-1.jpg">
    <img src="img/img_port/reportage/thumb-1.jpg" />
</a>
<a href="img/img_port/reportage/img-2.jpg">
    <img src="img/img_port/reportage/thumb-2.jpg" />
</a>
<a href="img/img_port/reportage/img-3.jpg">
    <img src="img/img_port/reportage/thumb-3.jpg" />
</a>
<a href="img/img_port/reportage/img-4.jpg">
    <img src="img/img_port/reportage/thumb-4.jpg" />
</a>

And this Javascript:

<script type="text/javascript">
        $(document).ready(function() {
            $("#hash").lightGallery({
                download: false,
                counter: false,
                hash: true;
                galleryId: 1
                });
            $("#hash2").lightGallery({
                download: false,
                counter: false,
                hash: true;
                galleryId: 2
                    });
            });
    </script>

Is this correct or is something wrong?


Solution

  • <script type="text/javascript">
        $(document).ready(function() {
            $("#hash").lightGallery({
                download: false,
                counter: false,
                hash: true,  /*Here is the error.*/
                galleryId: 1
                });
            $("#hash2").lightGallery({
                download: false,
                counter: false,
                hash: true,/*Here is the error.*/
                galleryId: 2
                    });
            });
    </script>