팬시 박스의 JW 플레이어 사이징 문제

Question

JW Player을 통해 호스팅되는 비디오를 표시하려면 fancyBox을 사용하고 있습니다.

JW Player에서 제공하는 "싱글 라인 소스 코드"를 사용하거나 iframe 옵션을 사용하면 차이가없는 것 같습니다. 비디오는 여전히 최대 100px 크기로 표시됩니다. 나는 이것을 제어하고있는 것을 알아낼 수 없어서 fancybox를 특별히이 목적으로 커스터마이징해야하는 이유를 알 수 없다.

이 문제가 발생한 사람이 있습니까?

내 HTML은 다음과 같습니다

<a href="#media1" rel="gallery" class="fancybox">01</a> 

<div id="media1" class="fancybox-content"> 
    <script src="//content.jwplatform.com/players/xxxxxxxx-xxxxxxxx.js"></script> 
</div> 

내 CSS는 다음과 같습니다

.fancybox-content { 
    display: none; // This hides any content that should appear within fancyBox 
    width: 100%; 
    max-width: 960px; 
} 

나는 데 문제를 설명하기 위해 설치 Codepen을했습니다.

Answer 1

트릭이 fancybox에 'autoSize : false'옵션을 추가했습니다. fancybox는 플레이어가 렌더링되기 전에 상자를 최소 크기로 자동 조절하는 것 같습니다. 펜이 업데이트되어 올바르게 작동합니다.

$(".fancybox").fancybox({ 
    autoSize: false 
});