jquery - jQuery Lightbox または同等の画像配列

Question

テキストリンクをクリックすると、ページのインラインコンテンツからではなく、配列から読み込まれた画像のスライドショーが起動するLightboxスタイルのギャラリーを実装しようとしています。私が見つけることができるすべての例は、何らかの形で関連するインライン画像のグループを使用しています (つまり、rel タグまたはクラスを使用)。Javascript 配列のパスを使用して画像を定義したいと考えています。

誰かが解決策を知っているか、ポインタを持っていますか? ティア。

Answer 1

以下は、プラグインサイトからダウンロードできる例で機能します。

こちらのデモ

$(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();
        }

Answer 2

あなたが何を求めているのか正確にはわかりませんが、これはあなたが探しているものですか?

images = ["path1.jpg", "path2.jpg"];
for (var i = 0; i  < images.length; i++)
  {
    var img = new Image();
    img.src = images[i];
    images[i] = img;
  }

URL を Image-objects に置き換えるのはかなり鈍いですが、書くのは短くなりました。

src-attribute が設定されている場合、画像はブラウザーによって読み込まれ、通常の dom 操作ごとに任意の html コンテナーに追加できます。

HTH。