CODEWITHSUNDEEP
javascriptlightgallery
Rob
Rob

Reputation: 333

Get data-src from lightGallery plugin

I am using the lightgallery plugin http://sachinchoolur.github.io/lightGallery/docs/api.html#attributes

and I am tying to get the data-src value when the image when clicked.

The basic HTML is as follows

<div id="work-grid" class="grid wow fadeIn animated">
   <div class="ecp-thumbnail element-item landing" data-iframe="true"  data- 
    src="image/landingpages/alta_1.jpg">
   <img class="img-responsive img-thumbnail" 
   src="image/landingpages/thumb_alta_1.jpg" />
  </div>
</div>

and my javascript is as follows

var $workGrid = $("#work-grid");

$workGrid.lightGallery({
    mode: 'lg-fade',
    cssEasing: 'cubic-bezier(0.25, 0, 0.25, 1)',
    download: false,
     share: false,
     selector: 'this'
});

$workGrid.on('onBeforeOpen.lg', function (event, prevIndex, index) {
    alert($workGrid.data('src'));
});

But I cannot seem to get the data-src attribute value of the clicked image.

I added selector: 'this' but I just cannot figure out how I am supposed to use that?

Any help would be appreciated.

Upvotes: 0

Views: 2153

Answers (2)

gohil vipul
gohil vipul

Reputation: 1

Try the following code

      var $lg =  $('#lightgallery').lightGallery({
            animateThumb: false,
            showThumbByDefault: false,
            controls:false
        });

        $lg.lightGallery();
        $lg.on('onBeforeSlide.lg',function(){
        let src =  $lg.data('lightGallery').$items.eq(0).data('src');
            getHighResolutionScreenShots(src);
        });

also you can replace this funcation getHighResolutionScreenShots(src);

Upvotes: 0

Rob
Rob

Reputation: 333

For anyone else trying to solve this I was able to get this index of the by using

$workGrid.on('onBeforeSlide.lg', function (event, index ) {

alert($(".ecp-thumbnail").eq(index).attr('data-src'));

});

Upvotes: 0

Related Questions