0

Fancybox ウィンドウに JW プレーヤーがあります。すべてがうまく機能しますが、設計上の問題は 1 つだけです。

プレーヤー ウィンドウが表示されているとき (起動時)、ウィンドウは下から上に「下から上」に移動します。これは、プレーヤーの下に別の div を追加したためです。どうすればこれを修正できますか? デモの例を次に示します: http://teodore.ge/test/demo/

私はそれをそのようにしました：

<script>

      $(".fancybox").fancybox({
        fitToView: false, // to show videos in their own size
        content: '<div></div>', // create temp content
        scrolling: 'no', // don't show scrolling bars in fancybox
        afterLoad: function () {

          // get dimensions from data attributes
          var $width = $(this.element).data('width'); 
          var $height = $(this.element).data('height');


          var link=$(this.element).context.attributes.yutubelink.nodeValue;

          this.content = ' <embed type="application/x-shockwave-flash"  src="player.swf" width="640" height="383"    style="undefined"  allowfullscreen="true" allowscriptaccess="always" wmode="opaque" flashvars="file='+link+'&amp;skin=nacht.zip&amp;autostart=true">'; 
        },
        afterShow: function(){
          var toolbar = "<div id='tools'>" + $("#appendContent div").eq(this.index).html() + "</div>";
           $(".fancybox-outer").append(toolbar);
          }
      });   

</script>


<div id="appendContent" style="display: none;  width: auto; height: auto;">
    <div > 1111   That div  is the problem <br><br><br>  1111111 <br> <br> </div>
    <div> 2222:  That div  is the problem  <br><br><br> 2222222 <br> <br> </div>
</div>



    <a class="fancybox"  yutubeLink="http://www.youtube.com/watch?v=p3iYnHx8P0s" > 
    <img src=" 1.jpg"  width="360" height="240"></a><br>

    <a class="fancybox"  yutubeLink="http://www.youtube.com/watch?v=USgLNBsnRGo"> 
    <img src=" 2.jpg" width="360" height="240"></a> <br>
4

1 に答える 1

0

プレーヤーの横に新しい div を追加していた関数を移動します。関数を afterShow() から afterLoad() 関数に移動します。読み込み後に div を追加すると、その問題が発生しました (div の場所が変わります)。プレーヤーは画面の中央にある必要があり、新しい div を追加していたときにその位置が変化していたためです。

于 2013-04-09T21:06:48.593 に答える