在手机微信浏览器上运行的,本来想是在选择完视频文件后

video标签 在chrom浏览器显示是正常的但是在手机浏览器上显示 控件全部挤在一起 (video放在一个固定宽高的盒子里面所以控件都挤在一起了 现在想到点击一张图片进行全屏bo'fang)

微信浏览器上运行的,本来想是在选择完视频文件后,截取第一帧,作为视频封面,在pc浏览器上测试没问题,视频能预览,也能截取图片。但是到了手机浏览器上就不行了,视频能预览,但是看不到截取的图片,之前一直以为是没有截取到图片,但是后来其实是截取到图片了,但是视频没有播放,所以截取到的图片就是一张空白图片,和手机背景白色混为一起了,根本就看不出来。

参考GPT和自己的思路:

关于第一个问题,可能是因为手机浏览器的窗口大小不同于PC浏览器,导致控件挤在一起。你可以使用CSS媒体查询来针对手机浏览器设置不同的CSS样式,尝试调整控件的布局。另外,在手机浏览器上点击图片进行全屏播放,可以使用一些开源的视频播放器插件来实现。

关于第二个问题,可能是因为手机浏览器在预览视频时默认使用了HTML5的video标签进行播放,并且不支持在播放时显示视频封面。你可以使用JavaScript来获取视频第一帧的图像,并将其作为封面显示。另外,为了确保视频能够正常播放,可以尝试将视频转换为不同的格式,并在HTML代码中添加多种格式的视频源以适应不同的设备和浏览器。