Question

有谁知道我可以在下面的代码中使用哪种条件来确定幻灯片是否即将结束？

换句话说，如果幻灯片显示中剩余的图像少于4张，请发送新的ajax调用并将响应附加到当前响应。

我设法得到每个图像的索引，但我在下面使用的条件，即if (index > 2)显然失败，因为它触发任何后续项目的ajax调用，每个幻灯片中的项目数量将因人而异，所以不会有固定的数字。以下是我到目前为止的情况。

同样在小提琴中here。

$(document).ready(function() {
    $("#links").lightGallery({
        selector: '.img-wrap',
        html:true,
        speed: 300,
    });     
    var $lg = $('#links');     
    $lg.lightGallery(); 
    $lg.on('onBeforeSlide.lg',function(event, index, fromTouch, fromThumb){        
        console.log(index, fromTouch, fromThumb);        
        if (index > 2) { // This doesn't work
            // Trigger new ajax call
            // Append items in response to current slidewhow
        }
    });
});

Answer 1

如果您使用.img-wrap

从元素的长度中减去缓冲区编号（在本例中为两个），该怎么办？

$(document).ready(function() {
    $("#links").lightGallery({
        selector: '.img-wrap',
        html:true,
        speed: 300,
    });     

    var $lg = $('#links');
    var bufferThreshold = 2;//number of images remaining before we fetch more

    $lg.lightGallery();

    $lg.on('onBeforeSlide.lg',function(event, index, fromTouch, fromThumb){
        console.log(index, fromTouch, fromThumb);
        if (index > $('.img-wrap').length - bufferThreshold) {
            //almost done, get more!
        }
    });

});

jQuery - Lightgallery.js - 检测即将结束的slidehsow

1 个答案: