1. 网站首页
  2. jquery插件
  3. video.js
  4. 正文内容

video.js插件使视频自适应容器的宽高的方法亲测

文章标签: 使用实例
  • :
  • 04-16 21:38
  • :
  • 63次
  • :
  • 0条
  • 2赞

简介本文主要和大家分享在使用video.js视频插件时，使我们网页里的视频可以自适应容器的宽高的方法。l

video.js插件是非常流行的一款HTML5视频插件，那么我们在使用此插件时，如何让我们网页里的视频能自适应容器的宽高呢？

其实是非常简单的，就是给视频加上样式“vjs-fluid”就行了:

<div style="width:250px">
    <video id="my-video" class="video-js vjs-fluid" controls preload="auto" data-setup="{}">	
        <source src="视频地址" type="video/mp4">	
        <p class="vjs-no-js">		
            浏览器不支持HTML5视频播放			  	
        </p>
    </video>
</div>

一般不要限制容器的高度 只限制宽度，这样高度就能自适应！

上一篇 用requirejs来加载video.js插件的方法

下一篇 jquery里判断元素是否在可视区域的方法及在线实例演示

您正在找的文章可能是：

• video.js使用方法手册

• 用requirejs来加载video.js插件的方法

• video.js动态加载视频的方法和在线实例演示

• video.js插件下载、官网地址、免费CDN加速地址

• jquery里获取表格内被点击的td单元格的内容的方法及在线实例演示

• jquery3.2.1中文CHM帮助手册下载

• 用requirejs来加载jquery图片验证码插件的方法及实例演示

• jquery里table表格排序的上体方法和完整实例演示

• jquery里用contentWindow来操作iFrame子框架，如传值，传递对象等[附在线实例演示]

• jquery.tablesort表格排序插件下载

• jquery图片或文字连续循环滚动特效[非常详细的教你如何自己动手写代码来实现]及在线实例演示

• twbs-pagination分页插件的使用说明文档

热点文章
热点图文
最近更新