javascript - Video.js 响应式不适用于小屏幕

Question

我已经制作了这个垃圾箱，我试图在其中使我的 video.js 响应。请让我知道我该怎么做。我尝试了很多，但在移动 View 上，它的控件总是浮出播放器并且不固定在其位置:http://jsbin.com/idinaf/627/edit

videojs.autoSetup();

videojs('example_video_1').ready(function(){
  console.log(this.options()); //log all of the default videojs options

   // Store the video object
  var myPlayer = this, id = myPlayer.id();
  // Make up an aspect ratio
  var aspectRatio = 264/640; 

  function resizeVideoJS(){
    var width = document.getElementById(id).parentElement.offsetWidth;
    myPlayer.width(width).height( width * aspectRatio );

  }

  // Initialize resizeVideoJS()
  resizeVideoJS();
  // Then on resize call resizeVideoJS()
  window.onresize = resizeVideoJS; 
});

Answer 1

对于较小的屏幕，您应该使用媒体查询来更改播放器控件的 CSS。我按照这个方法做了并且成功了。希望它也适合您。