微信小程序:video标签默认显示视频的第一帧作为封面

简介: 微信小程序:video标签默认显示视频的第一帧作为封面

微信小程序:video标签默认显示视频的第一帧作为封面


<video 
   src="video_url"
   controls="{{false}}"
   initial-time='0.01'
   muted
   autoplay
   object-fit="cover"></video>

参数


src            资源地址
controls:     显示播放控件
initial-time: 指定视频初始播放位置,设置为大于0的值,就会自动加载视频
autoplay:     自动播放视频, 如果不设置自动播放,会出现视频时长和播放按钮
muted:        设置静音播放
object-fit    视频大小与 video 容器 cover覆盖/contain包含

注意:


不建议在列表中直接使用video标签,页面中加载多个视频会很卡

建议使用 封面图+播放小icon,在列表中显示视频元素,点击后再进行播放操作,减少页面卡顿

相关文章
|
小程序
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
1138 1
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
|
人工智能 小程序 程序员
【视频测评 DEMO 参考】VSCode 神级 AI 插件通义灵码:完全免费+实战教程+微信贪吃蛇小程序
VSCode 神级 AI 插件通义灵码:完全免费+实战教程+微信贪吃蛇小程序
1288 8
|
人工智能 小程序 API
【一步步开发AI运动小程序】十七、如何识别用户上传视频中的人体、运动、动作、姿态?
【云智AI运动识别小程序插件】提供人体、运动、姿态检测的AI能力,支持本地原生识别,无需后台服务,具有速度快、体验好、易集成等优点。本文介绍如何使用该插件实现用户上传视频的运动识别,包括视频解码抽帧和人体识别的实现方法。
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的医笙小程序附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的医笙小程序附带文章源码部署视频讲解等
186 2
基于springboot+vue.js+uniapp的医笙小程序附带文章源码部署视频讲解等
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的傣族节日及民间故事推广小程序附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的傣族节日及民间故事推广小程序附带文章源码部署视频讲解等
167 4
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的“口腔助手”小程序附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的“口腔助手”小程序附带文章源码部署视频讲解等
237 3
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的学生毕业管理小程序附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的学生毕业管理小程序附带文章源码部署视频讲解等
222 1
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小演员招募小程序附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小演员招募小程序附带文章源码部署视频讲解等
158 1
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的二手书籍拍卖小程序附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的二手书籍拍卖小程序附带文章源码部署视频讲解等
213 1
|
移动开发 JavaScript 开发工具
微信浏览器内 h5 直接唤醒 app 之 微信开放标签 wx-open-launch-app
微信浏览器内 h5 直接唤醒 app 之 微信开放标签 wx-open-launch-app