vue项目插入视频-mp4
1. v.vue文件:
<template>
<div>
<div class="contain">
<my-video :sources="video.sources" :options="video.options" class="video">
</my-video>
</div>
</div>
</template> <script>
import myVideo from 'vue-video'
export default {
data() {
return {
video: {
sources: [{
src: '../../../../static/video/v.mp4'
}],
options: {
autoplay: true,
volume: 0.6,
poster: 'http://covteam.u.qiniudn.com/poster.png'
}
}
}
},
components: {
myVideo
}
}
</script>
2. v.css文件:(video需要一定的宽和高)
.video{
width:100px;
height:100px;
}
vue项目插入视频-mp4的更多相关文章
- 在Vue项目使用quill-editor带样式编辑器(更改插入图片和视频)
vue-quill-editor默认插入图片是直接将图片转为base64再放入内容中,如果图片比较大的话,富文本的内容就会很大. 插入视频是直接弹框输入URL地址,某些需求下我们需要让用户去本地选择自 ...
- 后盾网lavarel视频项目---Vue项目使用vue-awesome-swiper轮播插件
后盾网lavarel视频项目---Vue项目使用vue-awesome-swiper轮播插件 一.总结 一句话总结: vue中的插件的使用和js插件的使用一样的简单,只是vue插件的引入过程有些不同 ...
- C#/VB.NET 向PowerPoint文档插入视频
如今,Microsoft Office PowerPoint在我们日常生活中的应用已经很广泛了,利用Microsoft Office PowerPoint不仅可以创建演示文稿,还可以在互联网上召开面对 ...
- H5插入视频兼容主浏览器
插入视频的方法有很多种,但是有一些方法不兼容. 方法1:DW插入视频利用DW插入的视频为flv格式,操作较简单,但是代码复杂,需要浏览器支持flash插件:火狐浏览器需要手动下载flash插件,比较麻 ...
- 【转】向HTML中插入视频并兼容所有浏览器的方法
原文地址:http://www.jb51.net/web/168548.html 向HTML中插入视频有两种方法,一种是古老的object标签,一种是html5中的video标签,前者兼容性相对好些, ...
- 如何在html中插入视频
如何在html中插入视频 1,插入优酷视频: 在优酷分享界面有个html代码,直接复制放入body中,定义div的align居中即可 2.插入本地视频:用video属性 用mp4格式 <vid ...
- 动态获取爱奇艺上传视频mp4格式url地址
有时候,在工作中有些客户需要用到视频,我们大家都知道视频是非常的耗费流量的,因此,如果因为项目要求客户单独买台视频服务器是非常划不来的.那么将视频上传到优酷,爱奇艺等视频网站来托管那是一件很好的解决方 ...
- HTML中插入视频
最常用的向HTML中插入视频的方法有两种,一种是古老的<object></object>标签,一种是html5中的<video></video>标签. ...
- vue项目目录介绍
Vue项目目录 初始化项目 vue init webpack []projectname] cd [projectname] npm install vue run dev 目录树 +---build ...
随机推荐
- Css学习(2)
1 标签分类(显示方式) 块元素 典型代表,Div,h1-h6,p,ul,li 特点: ★独占一行 ★可以设置宽高 ★ 嵌套(包含)下,子块元素宽度(没有定义情况下)和父块元素宽度默认一致. 行内元素 ...
- Python的可迭代对象、迭代器和生成器
可迭代对象(Iterable) 这些可以直接作用于for循环的对象统称为可迭代对象:Iterable. 我们已经知道,可以直接作用于for循环的数据类型有以下几种: 一类是集合数据类型,如list.t ...
- boost json序列化
json序列化 #ifndef FND_JSON_OBJECT_H #define FND_JSON_OBJECT_H #include <sstream> #include <bo ...
- boost serialize序列化
boost序列化 #ifndef FND_SERI_H #define FND_SERI_H #include <boost/archive/text_oarchive.hpp> #inc ...
- css初探
CSS 语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. selector { property: value; ...
- 请求(Request)的参数(Param)里包含特殊字符(#等)的正确处理方式
当调用restful接口,并且url中有参数传过去时,比如http://test.com?param=woshi#miaoyinga. 后台在使用@RequestParam("param&q ...
- flask 简单的语音识别
from aip import AipSpeech,AipNlp #AipNlp 为自然语言处理 """ 你的 APPID AK SK """ ...
- 500 Internal Privoxy Error
打开网站突然发现网站无法打开了,一脸懵逼,服务器重启也不行,明明能ping通,网上查的答案千奇百怪的 500 Internal Privoxy Error Privoxy encountered an ...
- 【Jmeter自学】Jmeter作用域(五)
.Jmeter作用域 .Jmeter参数化 .Jmeter的集合点 .jmeter之关联 1.Jmeter作用域 问题: 每个元件作用域 层次结构确认 每个元件执行顺序 配置元件 前置 定时器 Sam ...
- android 开发 在一个工具类(或者适配器class)里启动activity
实现思路: 1.需要给工具类里传入context: 2.使用上下文mContext.startActivity启动activity 例子1: public class SafePlaceRecycle ...