비디오 JS 플레이어 (및 비디오) 확장 방법

Question

비디오 JS 플레이어를 사용하여 비디오를 게시하고 싶지만 다른 화면 크기에 따라 확장 할 수 없습니다.

Video JS homepage에서 데모 비디오 크기는 970px에서 600px 너비로 조정됩니다. 하지만 "이 플레이어 삽입"버튼을 누르시면 얻게되는 코드는 확장되지 않습니다. 다음 동작에서 해당 코드 : 비디오의 사이즈 (640 × 264)를 지정하는 소스 코드에서

• http://www.casedasole.it/video/index.html

지만, 데모 페이지 코드 video 요소에 대한 크기를주지 않는다 . 비디오 js 페이지의 소스를 살펴 보았지만, 확장 성을 높이기 위해 너무 많은 일이 발생했습니다 (13 개의 스크립트 및 4 개의 스타일 시트). 비디오 js 포럼도 없으므로 그들은 recommend asking here입니다.

아무도 어떻게 할 수 있는지 아니?

Answer 1

그것은 당신은 미디어 쿼리를 사용하여에는 Video.js 플레이어 확장 할 수 http://www.video-js.com/js/home.js L72

videojs("home_video", {"height":"auto", 
"width":"auto"}).ready(function(){ 
    var myPlayer = this; // Store the video object 
    var aspectRatio = 5/12; // Make up an aspect ratio 

    function resizeVideoJS(){ 
     // Get the parent element's actual width 
     var width = document.getElementById(myPlayer.id()).parentElement.offsetWidth; 
     // Set width to fill parent element, Set height 
     myPlayer.width(width).height(width * aspectRatio); 
    } 

    resizeVideoJS(); // Initialize the function 
    window.onresize = resizeVideoJS; // Call the function on resize 
    }); 

Answer 2

에서 온다. 작은 화면에서는 미디어 쿼리를 사용하여 비디오 js 컨트롤의 CSS를 변경하십시오. 이것은 나를 위해 일했다.