video标签播放第一帧
1 2 3 4 5 6 | <video width= "100%" height= "100%" muted x5-video-player-type= "h5" controls controlsList= 'nodownload noplaybackrate' disablePictureInPicture preload= "metadata" webkit-playsinline playsinline x5-video-orientation= "portraint" > <source :src= "i.fileUrl + '#t=0.1'" :type= "'video/' + i.fileType" > <!-- 视频加载失败,格式不支持,请截图反馈给技术中心 --> 您的浏览器不支持 video 标签。 </video><br>重点是:preload值为加载, '#t=0.1' , 这个方法h5页面失效, |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | 第二种方法,亲测有效,无js <div class = "video-wrapper" v- for = "(i, iIndex) in detailInfo.mediaFileBos" :key= "iIndex" > <video style= "object-fit: fill;" width= "100%" height= "100%" muted controls playsinline webkit-playsinline x5-video-player-type= "h5" controlsList= 'nodownload' oncontextmenu = "return false" disablePictureInPicture preload= "metadata" :poster= 'i.fileUrl+"?x-oss-process=video/snapshot,t_2"' x5-video-orientation= "portraint" > <source :src= "i.fileUrl + '#t1'" :type= "'video/' + i.fileType" > <!-- 视频加载失败,格式不支持,请截图反馈给技术中心 --> 您的浏览器不支持 video 标签。 </video> </div> 参考链接: https: //help.aliyun.com/document_detail/64555.html?spm=a2c4e.11153940.0.0.c1034696M91eGA http: //t.zoukankan.com/belongs-to-qinghua-p-12545558.html |
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· DeepSeek 开源周回顾「GitHub 热点速览」
· 物流快递公司核心技术能力-地址解析分单基础技术分享
· .NET 10首个预览版发布:重大改进与新特性概览!
· AI与.NET技术实操系列(二):开始使用ML.NET
· 单线程的Redis速度为什么快?