视频直播、点播H5播放器SkeyeWebPlayer适配排除,移动端,常见移动端Web页面问题及解决方案

免费视频直播、点播H5播放器SkeyeWebPlayer适配排除,移动端,常见移动端Web页面问题及解决方案
SkeyeVSS其独创的ws-rtsp流媒体直播技术,兼容传统安防流媒体的同时,不需要安装浏览器插件,解决互联网接入安防监控延迟高、起播慢等问题;支持全平台终端H5直播点播(PC、Web、Android、iOS)。
一般情况下SkeyeWebPlayer播放器的宽度是自适应,高度css 或者 new WebMediaPlayer()中的height参数来设置,常用的56.25 (56.25% 等于 16:9 )

视频直播、点播H5播放器SkeyeWebPlayer适配排除,移动端,常见移动端Web页面问题及解决方案_第1张图片

1、移动端web禁止用户伸缩网页

我们可以使用viewport禁止放大和缩小,通常把user-scalable设置为0来禁止用户对网页视图的伸缩行为,完整的viewport信息:

2、SkeyeWebPlayer 播放器在移动端使用

SkeyeWebPlayer 播放器默认情况下会根据屏幕宽度自动进行自适应,默认宽度等于100%,在外部盒子没有设置宽度的情况下,播放器的宽度与屏幕相等,在初始化播放器 height:0 或者不设置时,可以用css来设置hegiht。
new WebMediaPlayer(
    this.url,
    `skeyePlayer`,
    this.callbackFunc,
    {
      cbUserPtr: this,
      decodeType: 'auto',
      openAudio: 0,
      BigPlay: false,
      // Height: 0  // 56.25
    })


视频直播、点播H5播放器SkeyeWebPlayer适配排除,移动端,常见移动端Web页面问题及解决方案_第2张图片

横屏模式模式下,

视频直播、点播H5播放器SkeyeWebPlayer适配排除,移动端,常见移动端Web页面问题及解决方案_第3张图片

3、SkeyeWebPlayer 播放器在移动端强制横屏

通过css媒体查询判断横竖屏,并分别指定样式:



强制横屏如图:(强制通过页面 禁止app或手机的横竖屏的切换是不现实的,H5只能针对自身页面做适配!!!)

视频直播、点播H5播放器SkeyeWebPlayer适配排除,移动端,常见移动端Web页面问题及解决方案_第4张图片

你可能感兴趣的:(程序员c++)