收藏
回答

H5页面同层播放器强制横屏展示不正常-版本7.0.6

1、微信版本7.0.6 H5页面强制视频横屏时,展示不正常,微信7.0.4显示正常

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>同层播放器测试</title>
    <style>
        body{
            margin: 0;
            padding: 0;
        }
    </style>
</head>
<body>

    <div id="video-wrap">

       <!-- 去掉 x5-video-orientation="landscape" 点击右下角旋转显示正常 -->

        <video preload src="https://www.runoob.com/try/demo_source/movie.mp4"
        controls
        x-webkit-airplay="true"
        x5-video-player-type="h5"
        x5-video-orientation="landscape" 
        id="video"></video>
    </div>
</body>
</html>

正常显示(去掉x5-video-orientation="landscape"):

显示不正常(增加x5-video-orientation="landscape"):

2、横屏状态下 无法将其他html元素置顶同层播放器之上

最后一次编辑于  09-03  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

2 个回答

  • nickname
    nickname
    09-03

    麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    09-03
    赞同
    回复 5
    • 铭楷。
      铭楷。
      09-03
      你好, 测试的机型有 华为畅享8,荣耀10,oppo reno 系统版本号均为9.0 微信版本号均为7.0.6 需要真机调试 代码附在问题描述里面了
      09-03
      回复
    • nickname
      nickname
      09-03回复铭楷。

      这个是在web-view中使用还是在微信浏览器中直接打开?给个直接可使用的链接测试一下,thanks

      09-03
      回复
    • 铭楷。
      铭楷。
      09-17

      是在微信浏览器里面打开的,给一个官方的链接http://res.imtt.qq.com/qqbrowser/js/test_video_orientation_attr.html先点击横屏播放按钮,再点击播放视频 会出现图一 非正常展示

      正常展示

      09-17
      回复
    • nickname
      nickname
      09-18回复铭楷。

      你指的点击横屏播放视频是这个吧?我点击没有反应的呀


      09-18
      回复
    • 铭楷。
      铭楷。
      09-18
      是的 点击之后 再点击视频 让他进入同层播放器播放
      09-18
      回复
  • 铭楷。
    铭楷。
    09-03

    你好,

    测试的机型有 华为畅享8,荣耀10,oppo reno 系统版本号均为9.0 微信版本号均为7.0.6

    需要真机调试

    代码附在问题描述里面了

    09-03
    赞同
    回复
问题标签