【问题标题】:Change HTML5 video tag width and height through Javascript通过 Javascript 更改 HTML5 视频标签的宽度和高度
【发布时间】:2013-02-14 06:59:56
【问题描述】:

我在客户端 JS 中有以下代码:

$(function() {
  $("#player1").html(
    '<video width=' + width + ' height=' + height + ' autoplay>' +
      '<source src=' + curPlayListHrefs[0] + ' type="video/youtube"></source>' +
    '</video>'
  );
});

我试过了:

  var video = document.getElementsByTagName("video")[0];
  video.videoHeight = 300;
  video.videoWidth = 700;

我可以更改视频标签的宽度/高度吗?

【问题讨论】:

    标签: jquery html html5-video


    【解决方案1】:

    尝试设置它的宽度和高度属性

    var video = document.getElementsByTagName("video")[0];
    video.setAttribute('height', '300');
    video.setAttribute('width', '700');
    

    或设置它的宽度和高度属性

    var video = document.getElementsByTagName("video")[0];
    video.height = 300;
    video.width = 700;
    

    【讨论】:

    • 感谢您的快速响应。选项 2 有效。但是,如果将相同的代码放在 $(window).resize() 中。它不会重置视频的高度和宽度。要调整窗口大小,我展开/折叠浏览器窗口。你知道原因吗? TIA
    • 我发现如果代码是在$('video').mediaelementplayer({...});执行之后执行的,那么它不会重置video标签。你知道原因吗?
    • 在选项 1 中,您必须使用 '300px' 和 '700px'。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2017-07-15
    • 1970-01-01
    • 1970-01-01
    • 2013-06-08
    • 1970-01-01
    • 2011-06-24
    • 1970-01-01
    相关资源
    最近更新 更多