随笔 - 315  文章 - 1  评论 - 12  阅读 - 24万

uniapp视频封面层级问题

1、app端建议使用视频的第一帧作为视频封面,自定义封面遮罩无法显示,当封面图是白色背景时看不到视频播放按钮。

2、h5直接使用封面属性可正常展示。

 

复制代码
<!-- #ifdef APP-PLUS -->
                <!-- app使用视频的第一帧作为封面,自定义封面没显示遮罩,浅色封面看不到按钮 -->
                <video id="myVideo" object-fit="cover"
                    :poster="courseInfo.course.url+'?x-oss-process=video/snapshot,t_0,f_jpg'"
                    :show-fullscreen-btn="true" :src="courseInfo.course.url" controls :enable-play-gesture="true"
                    @play="toPlay" @pause="toPause" @timeupdate="timeupdate">
                <!-- #endif -->
                
                <!-- #ifdef H5 -->
                <video id="myVideo" object-fit="cover"
                    :poster="courseInfo.course.thumb"
                    :show-fullscreen-btn="true" :src="courseInfo.course.url" controls :enable-play-gesture="true"
                    @play="toPlay" @pause="toPause" @timeupdate="timeupdate">
                <!-- #endif -->
                </video>

复制代码

app使用封面属性poster 作为视频封面的效果:

 

 

app使用视频第一帧作为视频封面的效果:

 

 

posted on   小虾米吖~  阅读(424)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」

点击右上角即可分享
微信分享提示