fancybox의 Flowplayer?

Question

Flowplayer를 Fancybox에 표시하려고 시도하고 있지만 실제로 작동시키지는 못합니다. 지금까지 내 코드입니다.

  $("a.video_link").click(function() { 

      $.fancybox({ 
       'autoScale': false, 
       'transitionIn': 'none', 
       'transitionOut': 'none', 
       'title': this.title, 
       'width': 680, 
       'height': 495, 
       'href': '/flowplayer/flowplayer.swf?video=myvideo.flv', /* have also tried a couple of other options for the url settings, but without luck) 
       'type': 'swf', 
       'swf': { 
        'wmode': 'transparent', 
        'allowfullscreen': 'true' 
       } 
      }); 

      return false; 
     }); 

의견이 있으십니까?

Answer 1

jQuery를 사용하여 SWF 개체를 만들려고 했으므로 흐름 플레이어 컨텐트 설정을 사용하여 swf params를 직접 설정하여 모델의 html을 설정했습니다. ??

또한 디버그 창을 확인해보십시오. 오류가 표시되는지 확인하십시오.

- EG

var flashvars = { //Change this with $.extend within click callback if you need to! 
    file : 'yvideo.flv' 
} 
var flowBoxParams = { 
    'autoScale': false, 
    'transitionIn': 'none', 
    'transitionOut': 'none', 
    'width': 680, 
    'height': 495, 
} 

var $conatiner = $('<div></div>').attr('id','MediaPlayerHolder').hide(); 

swfobject.embedSWF("/flowplayer/flowplayer.swf","MediaPlayerHolder","300","120","9.0.0",flashvars,params,attributes); 

$("a.video_link").click(function(){ 
     //Merge basic settings with title 
     params = $.extend(flowBoxParams,{title:this.title,html:$container}); 

     //Send object to FlowPlay 
     $.fancybox(params); 

    //Show the video play 
    $($container).show(); 
}); 

이것은 단지 기본적으로 그 안에 기본 설정 변수를 설정하는 것입니다 (FlashVars를, flowBoxParams)의 아이디 (MediaPlayerHolder)와 빈 DIV 컨테이너를 생성하고 표시로 설정 : 없음.

그런 다음 flowplayer swf 인 swfObject를 사용하여 기본 플래시 요소를 만들고 숨겨진 div 컨테이너에 할당합니다.

다음 사용자 클릭이 활성화 될 때까지 기다렸다가 기본 설정을 변경하여 유량 값 옵션에 제목 값을 추가합니다.

그러면 우리는 흐름 플레이어에게 무엇을해야하는지 알려줍니다.

얇은 용기의 시인성을 변경합니다.

이것은 테스트되지 않았지만 오류가있는 경우 swf 자체를로드 할 때 흐름이 엄격하지 않은 한 모든 오류를 처리해야합니다.

Answer 2

fancybox를 수동으로 실행하고 그 내용을 플로 플레이어로 설정해보십시오. 링크가있는 예를 들어 : 기본적으로 있으며, Flowplayer는 컨테이너의 크기를 차지하고, 그렇게 볼 유한 차원을 부여해야한다는

$('a.videoLink').click(function(e) { 
    e.preventDefault(); 

    var container = $('<div/>'); 

    container.flowplayer(
     'http://releases.flowplayer.org/swf/flowplayer-3.2.7.swf', 
     $(this).attr('href') 
    ); 

    $.fancybox({ 
     content: container, 
     width: 300, height: 200, 
     scrolling: 'no', 
     autoDimensions: false 
    }); 
}); 

참고 :

<a href="http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv" 
    class="videoLink">Demo</a> 

이 같은 JQuery와 클릭 기능을 만들 그것 제대로.

Answer 3

내가이 많이을, 나는 일에 그것을 얻을 수있는 유일한 방법은

자바 스크립트 >>

flowplayer(".player", "http://www2.imperial.ac.uk/business-school/etu/courses_1112/common/scripts/flowplayer/flowplayer-3.2.7.swf"); 

$('.yourbox').fancybox(); 

html로 >>

<a class="yourbox" href="#data" >This shows content of element who has id="data"</a> 

<div style="display:none"> 
    <div id="data"> 
     <a href="http://helix.imperial.ac.uk/bsflash/courses/finance_group/ethics/icm.mp4" style="display:block;width:640px;height:360px" class="player"></a> 
    </div> 
</div> 

, 단순히이 수행하여이었다 당신이 만약 이 방법을 사용하면 상자를 닫을 때 플레이어를 언로드하기 위해 해킹을해야합니다.