Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/406.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Video.js响应在小屏幕上不起作用_Javascript_Jquery_Html_Video_Html5 Video - Fatal编程技术网

Javascript Video.js响应在小屏幕上不起作用

Javascript Video.js响应在小屏幕上不起作用,javascript,jquery,html,video,html5-video,Javascript,Jquery,Html,Video,Html5 Video,我制作了一个垃圾箱,试图让我的video.js响应。请让我知道我该怎么做。我试了很多次,但在mobile view上,它的控件总是从播放器中浮动出来,并且不固定在它的位置上: 对于较小的屏幕,您应该使用媒体查询来更改播放器控件的css。 我用这种方法做的,它成功了。希望它对你也有用 videojs.autoSetup(); videojs('example_video_1').ready(function(){ console.log(this.options()); //log all

我制作了一个垃圾箱,试图让我的video.js响应。请让我知道我该怎么做。我试了很多次,但在mobile view上,它的控件总是从播放器中浮动出来,并且不固定在它的位置上:


对于较小的屏幕,您应该使用媒体查询来更改播放器控件的css。 我用这种方法做的,它成功了。希望它对你也有用

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; 
});