首页在uniapp中点击video标签播放按键自动全屏播放

在uniapp中点击video标签播放按键自动全屏播放

时间: 2025-01-01 09:35:29 浏览: 113

在UniApp中，如果你想让`video`标签的播放按键默认触发全屏播放，你可以通过设置`playsinline`属性为`false`来阻止视频在非全屏状态下播放。然后，你需要监听视频元素的`click`事件，当用户点击播放按钮时，手动调用`fullscreen`属性切换到全屏模式。下面是一个简单的示例代码： ```html <template> <view> <video id="myVideo" playsinline="false">  </video> <button @click="toggleFullScreen">播放</button> </view> </template> <script> export default { methods: { toggleFullScreen() { const video = document.getElementById('myVideo'); if (!video.fullscreen) { video.requestFullscreen(); } else { // 如果已在全屏模式下，则退出全屏 if (document.exitFullscreen) { document.exitFullscreen(); } } }, }, }; </script> ``` 在这个例子中，当你点击按钮时，如果视频不在全屏状态，会请求全屏；如果已经在全屏，就会退出全屏。

阅读全文