-1

ポートフォリオのウェブサイトを構築していますが、ファンシーボックスを使用してシンプルなギャラリーを作成したいと思います。

1つのセクションのすべての画像を1つのフォルダー(「gallery1」)内に配置し、ユーザーがフォルダー内のすべての画像をクリックできるようにします。

これは私のhtmlです:

<div class="content_image" rel="gallery" href="image01_large.jpg" ><img src="gallery1/image01_small.jpg"/></div>

このjQueryスクリプトを使用しようとしていますが、機能していません。

<script type="text/javascript">

$("div[rel=gallery]").fancybox({
                'transitionIn'      : 'none',
                'transitionOut'     : 'none',
                'titlePosition'     : 'over',
                'titleFormat'       : function(title, currentArray, currentIndex, currentOpts) {
                    return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
                }
            });

</script>

どんな助けでも大いに感謝されるでしょう!

4

1 に答える 1

0

jQueryギャラリープラグインのリストはここにあり、更新されたバージョンはここにあります。

ギャラリープラグインは、人気のあるすべてのブラウザーを処理し、フィネスで効率的に動作するようにコーディングされているため、スクリプトの小さなビットではなく、ギャラリープラグインを使用する必要があります。そこで適切なオプションを見つけて、プラグインの使用例を試すことをお勧めします。

編集

また、これを試してください:

<script type="text/javascript">

$(function(){$("div[rel=gallery]").fancybox({
                'transitionIn'      : 'none',
                'transitionOut'     : 'none',
                'titlePosition'     : 'over',
                'titleFormat'       : function(title, currentArray, currentIndex, currentOpts) {
                    return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
                }
            })});

</script>
于 2013-03-01T18:22:18.790 に答える