0

私は現在 Lightbox 2 (http://lokeshdhakar.com/projects/lightbox2/) を使用していますが、これはすべて正常に動作していますが、微調整が必​​要です。

サムネイルをクリックしたときにすべての画像を縦に表示したい。したがって、3 つの画像がすべて同じ rel="lightbox[whatever]" を使用している場合、それらすべてを出力したいと考えています。「次へ」ボタンと「前へ」ボタンを備えた「5 枚中 1 枚の画像」は必要ありません。

私はすべてを検索し、解決策を見つけることができませんでした。アイデア、スニペット、または外部 URL をお持ちの方がいらっしゃいましたら、よろしくお願いいたします。

コード例:

<a href="resources/images/ClassicCarriers/ClassicCarriers1.jpg" rel="lightbox[classicCarriers]" title="">
    <img src="Resources/Images/classicCarriers_grey.jpg" class="recentWork" title="Classic Carriers" alt="Classic Carriers"/>
</a>
<a href="resources/images/ClassicCarriers/ClassicCarriers2.jpg" rel="lightbox[classicCarriers]" title=""></a>
<a href="resources/images/ClassicCarriers/ClassicCarriers3.jpg" rel="lightbox[classicCarriers]" title=""></a>
4

2 に答える 2

0

ファンシーボックスをお試しください。効果を画像に直接添付する代わりに、3 つの画像を含む HTML に添付します。

于 2012-06-13T02:34:06.017 に答える
0

http://www.jacklmoore.com/colorboxを使用して、目的を達成することもできます。次のコードを確認してください

HTML

<div id="container">
    <img src="http://placekitten.com/100/100" width="100px">
    <img src="http://placekitten.com/100/100" width="100px">
    <img src="http://placekitten.com/100/100" width="100px">
</div>

jQuery 

$(function(){
    $('#container img').click(function(e){
      e.preventDefault();
      $.colorbox({
        href: '#container',
        inline: true
     });    

  });
});

画像のいずれかをクリックすると、3 つすべてがカラーボックスに表示されます。

働くフィドル
</p> 

​
于 2012-06-13T03:00:39.197 に答える