0

画像とビデオを含むファンシーボックスギャラリーがあります。画像をクリックしてマウスのスクロールホイールを使用すると、さまざまな画像を参照できますが、常にビデオがスキップされます。ビデオをクリックすると、うまく再生され、すべて...

ギャラリーの画像をブラウジングするときに自分のビデオに移動できるようにしたいのですが...

これは私がwww.charbelnicolas.comでやっているウェブサイトです（私が話しているギャラリーを見るには、2番目のページのIIをクリックしてください）

今...画像とビデオは同じrelで"gallery2"、これは私がギャラリーに使用しているコードです:

    <script type="text/javascript">

        $(document).ready(function() {
        $(".fancybox").fancybox({ helpers: { title: false } });});

    </script>


    <script type="text/javascript">

    $(document).ready(function() {
    $('.fancybox-media').fancybox({ 'minWidth': 720, 'minHeight': 480, helpers : { media : {}}});});

    </script>

ビデオにナビゲーション矢印が表示され、ギャラリーを閲覧中にキーボードまたはマウスのスクロールホイールを使用すると、画像とともにビデオが表示されるようにするにはどうすればよいですか? （そのため、ビデオをスキップしなくなりました）

Googleグループのディスカッションを検索しました.JFKからのさまざまな回答を見ましたが、うまくいかないようです...私のウェブサイトをチェックしていただければ、何が問題なのか教えていただけるかもしれません.

ありがとうございました

4

1 に答える 1

0

画像とビデオの両方に必要なスクリプトは 1 つだけです。

minWidth動画にや などのオプションを渡したい場合は、次のようなリンク内で minHeight(HTML5)data-*属性 (data-min-width="720"や など) を使用して行います。data-min-height="480"

<a rel="gallery2" class="fancybox" href="http://vimeo.com/59469665" data-min-width="720" data-min-height="480"><img class="left" src="http://charbelnicolas.com/thumbs/anunciotedelimonthumb.png" alt="" /></a>

beforeShow次に、次のようなコールバック 内でこれらの値をフェッチします。

$(".fancybox").fancybox({
    beforeShow: function () {
        this.minWidth  = $(this.element).data("min-width");
        this.minHeight = $(this.element).data("min-height");
    },
    helpers: {
        media: {}
    }
});

JSFIDDLEを参照してください

jquery.fancybox-media.jsPSファイルをロードすることを忘れないでください。

于 2013-02-27T07:50:00.227 に答える