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

时间:2014-07-12 19:09:48

标签: javascript jquery html5 video html5-video

我已经制作了这个bin,我试图让我的video.js响应。请让我知道我该怎么做。我尝试了很多但是在移动视图上它的控件总是漂浮在播放器之外并且不会粘在它的位置: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; 
});

1 个答案:

答案 0 :(得分:1)

对于较小的屏幕,您应该使用媒体查询来更改播放器控件的CSS。 我是这样做的,它有效。希望它也适合你。