jQuery Lightbox或与图像数组等效的 [英] jQuery Lightbox or equivalent with image array

问题描述

我正在尝试实施 Lightbox 风格的图库，点击文字链接启动从阵列加载的图像幻灯片，而不是从页面上的内联内容加载。我可以找到的所有示例都使用一组以某种方式相关的内联图像（即使用rel标签或类）。我想在Javascript数组中使用它们的路径定义我的图像。

I'm trying to implement a Lightbox-style gallery where clicking a text link launches a slideshow of images that are loaded from an array, not from inline content on the page. All the examples I can find use a group of inline images that are related somehow (i.e. using a rel tag or class). I want to define my images using their paths in a Javascript array.

任何人都知道解决方案或有任何指针？ TIA。

Anyone know the solution or have any pointers? TIA.

推荐答案

以下内容适用于您可以从插件站点下载的示例。

The following works with the example you can download from the plugin site.

演示此处

$(function() {
        $('#testLink').click( dynamicLightBoxinit );
    });

    function dynamicLightBoxinit(){
        images = ["photos/image1.jpg", "photos/image2.jpg","photos/image3.jpg","photos/image4.jpg","photos/image5.jpg"];
        var imageBuilder='';
        for (var i = 0; i  < images.length; i++)  {

            imageBuilder += '<a href="'+images[i]+'"><img src="';
            imageBuilder += images[i];
            imageBuilder += '" \></a>';
          }

          var lb = $(imageBuilder);
          lb.lightBox();
          lb.filter('a:first').click();
        }

这篇关于jQuery Lightbox或与图像数组等效的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！