在android 设备上,video.js上蒙层无法显示?应该怎么修改?

发布于 2022-09-12 13:18:36 字数 2402 浏览 16 评论 0

在android 设备上,video.js上蒙层无法显示?微信中是可以展示出来的?

         player = videojs('my-video', {
                controls: true, // 是否显示控制条
                // poster: '',
                preload: 'auto',
                autoplay: false,
                fluid: true, // 自适应宽高
                language: 'zh-CN', // 设置语言
                muted: false, // 是否静音
                inactivityTimeout: false,
                controlBar: { // 设置控制条组件
                    /* 使用children的形式可以控制每一个控件的位置,以及显示与否 */
                    children: [{
                            name: 'playToggle'
                        }, // 播放按钮
                        {
                            name: 'currentTimeDisplay'
                        }, // 当前已播放时间
                        {
                            name: 'progressControl'
                        }, // 播放进度条
                        {
                            name: 'durationDisplay'
                        }, // 总时间
                        {
                            name: 'FullscreenToggle'
                        },
                        {
                            name: 'volumePanel', // 音量控制
                            inline: false, // 使用水平方式
                        }
                    ]
                },
            }, function () {

                let cover = document.getElementById('my-video')
                    .getBoundingClientRect();
                this.on('timeupdate', function () {
                    videoMask = videoMask ? videoMask : document.getElementById('my-video')
                        .getBoundingClientRect();
                    if (this.currentTime() > 300) {
                        exitFull();
                        $("#videoMask").css({
                            'width': '100vw',
                            'height': videoMask.height + 'px',
                            'background-color': 'rgba(0,0,0,.9)',
                            'z-index': '99999999999',
                            'position': 'absolute',
                            'top': 0,
                            'left': 0,
                            'display': 'flex',
                            'align-items': 'center',
                            'justify-content': 'center',
                            'cursor': 'pointer'
                        })
                    }
                })

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

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

发布评论

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

评论(1

妳是的陽光 2022-09-19 13:18:37

现在的解决方法是,在需要展示蒙层的时,销毁player。

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