Question

我正在寻找Osvaldas自动加载imagelightbox插件的方法。

问题是：如何在页面上启动图像灯箱演示？现在，要开始图像查看，我必须单击图像缩略图。

这是我的JS代码：

var selectorG = 'a[data-imagelightbox="g"]';
    var instanceG = $(selectorG).imageLightbox({
    // show nav arrows
    onStart: function() {
    arrowsOn(instanceG, selectorG);
    closeButtonOn(instanceG);
    },
    // hide arrows
    onEnd: function() {
    arrowsOff();
    closeButtonOff();
    },
    // show loading image
    onLoadStart: function() {
    activityIndicatorOn();
    },
    // hide loading image
    onLoadEnd: function() {
    $('.imagelightbox-arrow').css('display', 'block');
    activityIndicatorOff();
    }
    });

/* This will autoload script, but with bug - events and images are cloned
$('a[data-imagelightbox="g"]').trigger('click');
*/

Answer 1

问题是您的代码会使用属性 data-imagelightbox =“g”在每个项目上触发点击事件。您必须在触发点击事件之前找到第一个（“a [data-imagelightbox =”g“]。first（）”https://api.jquery.com/first/）元素。

请尝试以下代码：

$(document).ready(function(){
    $('a[data-imagelightbox="g"]').first().trigger('click');
});

图像灯箱和自动加载图像

1 个答案: