0

Folk's、私はFancyboxとJwplayerを使用して、写真と同じようにビデオを表示しています。私の問題は、ナビゲーションバーが決して隠れないことです。また、ビデオのサイズが768px（元のサイズ）から725px（表示サイズ）に変更されましたが、その理由はわかりません。コードは次のとおりです：HTML

 <a class="video" href="../img/advertising/img/video/NEOCLAIM_Femme.flv" title="NEOCLAIM Femme"><img src="../img/advertising/ico/ic02-neocalmF.jpg" alt="" /></a>

そしてJS

   $("a.video").click(function() {
   $.fancybox({
    'scrolling' : 'no',
    'padding' : 0,
    'title' : this.title,
    'type' :'swf',
    'content': '<embed src="../jwplayer/player.swf?file='+this.href+'&amp;autostart=true&amp;fs=1" type="application/x-shockwave-flash" width="768" height="432" wmode="opaque" allowfullscreen="true" allowscriptaccess="always"></embed>',
    helpers : {
        overlay : {
            css : {
                'background' : 'rgba(0, 0, 0, 1)'
            }
        }
    }              
   });
   return false;
  });

私は初心者で、解決策を見つけることができません。ご協力ありがとうございました。ここにページへのリンクがありますこのリンクの後、最初のサムネイルをクリックする必要があります

4

1 に答える 1

1

これは実際にはファンシーボックスの問題ではありませんが、LongTailサポートフォーラムで見つけた可能性があります。

JWPlayerコントロールバーを非表示（およびホバーで表示）する場合は、flashvarを介して「上controlbar=over」に配置する必要があります...マウスがアイドル状態のときにコントロールバーが自動的に非表示になり、ホバーすると表示されます再生中のビデオ。

一方、次のdata-*ようにリンクの（HTML5）属性を使用して、各ビデオの特定のサイズを渡すことができます。

<a data-width="352" data-height="270" class="video" href="../img/advertising/img/video/NEOCLAIM_Femme.flv" title="NEOCLAIM Femme"><img src="../img/advertising/ico/ic02-neocalmF.jpg" alt="" /></a>

...（各ビデオの適切な値を使用width）heightそしてfancyboxスクリプトで、APIオプションを使用して自動サイズ変更を防止しますfitToView: false....次に、コールバックを使用してすべてのビデオのサイズをキャッチしafterLoadます。

完全なfancyboxカスタムスクリプトは次のようになります。 

$(document).ready(function () {
  $(".video").fancybox({
    padding : 0,
    fitToView: false, // fancybox won't auto-resize to fit in viewport
    content: '<span></span>', // create temp content
    scrolling: 'no',
    helpers : { overlay : { css : {  'background' : 'rgba(0, 0, 0, 1)' }  }  },
    afterLoad: function () {
      var $width = $(this.element).data('width'); // get dimensions from data attributes
      var $height = $(this.element).data('height');
      // replace temp content
      this.content = "<embed src='jwplayer.swf?file=" + this.href + "&autostart=true&amp;wmode=opaque&amp;controlbar=over' type='application/x-shockwave-flash' width='" + $width + "' height='" + $height + "'></embed>"; 
    }
  });
}); // ready

...オブジェクトの文字列値を追加したことに注意してください。また、メソッドを使用しておらず、fancyboxをセレクターに直接バインドしていることにも注意してください。さらに、実際には必要ないので、削除します。controlbar=overthis.content.click().video'title' : this.title'type' :'swf'

デモ ？...ここでそれを参照してください

于 2013-01-20T21:46:50.773 に答える