0

私は最初のライトボックスプラグインを試し、ナビゲーションコントロールの設定に対処する方法を見つけようとしています。簡単な修正である必要があることはわかっていますが、私はこれを完全に考えすぎています。HTMLコンテンツと画像をサポートし、ギャラリー接続に標準のrel属性を使用しています。私の質問は、relに基づいて1つの画像(またはdiv)から次の画像に移動するにはどうすればよいですか?

最初は$(this).nextAll('[rel = "ExampleGallery"]')が機能しますが、残念ながらこれは次のものを対象としません。だから...私は完全に軌道に乗っていないかもしれませんが、プラグインを呼び出すオブジェクトをループし、それらがrelタグを持っているかどうかを検出し、動的に作成された配列に値をプッシュする場合、私が今やろうとしていること配列名としてのギャラリー名。次に、配列内のインデックスを使用してオブジェクト間を移動します...

HTML

<img src="images/pic1.png" width="230px" height="215px" rel="Gallery1"/>
<img src="images/pic2.png" width="230px" height="215px" rel="Gallery2"/>
<img src="images/pic3.png" width="230px" height="215px" rel="Gallery1"/>

配列

Gallery1                  Gallery2

0 (ref to img tag 1)      0 (ref to img tag 2)
1 (ref to img tag 3)

繰り返しになりますが、私はこれを間違っていると思います。このためのJSをどのように作成しますか?

1-rel名に基づいて動的に配列を作成します2-後で参照するためにオブジェクトを配列にプッシュします

本当にありがとう!

4

1 に答える 1

2

これに使用したいデータ構造を考え直すべきだと思います。ただし、単に画像を収集するには、これは機能します。

var arrays = {};
$('img').each(function(){
    var arrayName = $(this).attr('rel');
    if(arrays.hasOwnProperty(arrayName)) {
        arrays[arrayName].push(this);
    }
    else {
        arrays[arrayName] = [this];
    }
}

最後に: arrays{ Gallery1: [img1, img3], Gallery2: [img2] }

于 2012-07-23T00:43:59.270 に答える