0

我在 Fancybox 窗口上有 JW 播放器。一切正常,现在我只有一个设计问题:

当播放器窗口显示时(当它触发时),它会“从下到上”移动,从下到上到窗口。这是因为我在播放器下添加了另一个 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 回答