video.js 在未全屏播放时,音量按钮无法拖动,且无法隐藏?

发布于 2022-09-12 13:02:59 字数 1859 浏览 25 评论 0

image.png
video.js 在未全屏播放时,音量按钮无法拖动,且无法隐藏?

 let player = videojs('my-video', {
                controls: true, // 是否显示控制条
                // poster: 'xxx', // 视频封面图地址
                preload: 'auto',
                autoplay: true,
                fluid: true, // 自适应宽高
                language: 'zh-CN', // 设置语言
                muted: false, // 是否静音
                inactivityTimeout: false,
                controlBar: { // 设置控制条组件
                    //  设置控制条里面组件的相关属性及显示与否
                    // 'currentTimeDisplay': true,
                    // 'timeDivider': true,
                    // 'durationDisplay': true,
                    // 'remainingTimeDisplay': false,
                    /* 使用children的形式可以控制每一个控件的位置,以及显示与否 */
                    children: [{
                            name: 'playToggle'
                        }, // 播放按钮
                        {
                            name: 'currentTimeDisplay'
                        }, // 当前已播放时间
                        {
                            name: 'progressControl'
                        }, // 播放进度条
                        {
                            name: 'durationDisplay'
                        }, // 总时间
                        {
                            name: 'FullscreenToggle'
                        }, 
                        {
                            name: 'volumePanel', // 音量控制
                            inline: false, // 使用水平方式
                        }
                    ]
                },
                sources: [ // 视频源
                    {
                        src: './video.mp4',
                        type: 'video/mp4',
                    }
                ]
            }, function () {
                console.log('视频可以播放了', this);
            });

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

沐歌 2022-09-19 13:02:59

pc 端应该是可以的

m 端取决于平台,如果是公司内部产品的webview可以考虑让端配合一下。如果是微信或者自带浏览器,最好还是放弃吧。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文