/*  http://blog.csdn.net/kepoon/article/details/53608190  */

//x5-video-player-type="h5" x5-video-player-fullscreen="true"

<video id="video" src="http://200011112.vod.myqcloud.com/200011112_733d3cea0f8a11e7afae899fa40866b8.f0.mp4" x5-video-player-type="h5" x5-video-player-fullscreen="true" style="background: rgb(0, 0, 0); width: 102.2%; height: 569px; margin-top: -1px; margin-left: -1.1%; margin-right: -1.1%;" id="video" loop="loop" width="100%" preload="auto" poster="" webkit-playsinline="true" playsinline="true" x-webkit-airplay="true" controls="controls"></video>

微信浏览器里面使用video标签,会自动变成全屏,改成下面就好了,起码可以在video标签之上加入其他元素。

<video id="videoID"webkit-playsinline="true" x-webkit-airplay="true"  playsinline="true"x5-video-player-type="h5"x5-video-player-fullscreen="true"width="100%" height="100%"preload="auto"  poster="" src="">

</video>

还有个问题,在Android的微信里面,就算加上了上面的属性,还会出现上下有黑边,不能全屏的问题。

解决办法:给video加上object-fit: fill;的style属性。

微信video最上层解决问题的更多相关文章

  1. 微信video标签全屏无法退出bug 本文系转载

    安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌..强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决.方法就是视频播放完毕后,用音频aud ...

  2. 微信video标签全屏无法退出bug

    安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌..强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决.方法就是视频播放完毕后,用音频aud ...

  3. 解决微信video全屏的问题,不在本页面播放

    在微信浏览器中使用video标签,点击播放会跳出本页面,自动进行全屏播放,原因是自动跳转到手机微信内置的浏览器中去播放去了!!! 在video中加上连个属性就好了,反正最近的一个项目,我是这样做的就好 ...

  4. html 微信video放大后无法返回问题

    android  video播放视频放大后无法返回,先debug下debugx5.qq.com 发现用的不是X5内核 直接激活  debugmm.qq.com/?forcex5=true  问题解决 ...

  5. 《转》完美解决微信video视频隐藏控件和内联播放问题

    地址:https://blog.csdn.net/xiao190128/article/details/81025378 var u = navigator.userAgent; var isAndr ...

  6. 在ios中微信video和audio无法自动播放解决方案

    WeixinJSBridgeReady页面初始化的时候会执行 document.addEventListener("WeixinJSBridgeReady", function ( ...

  7. 微信video和audio无法自动播放解决方案

    //音频,写法一<audio src="music/bg.mp3" autoplay loop controls>你的浏览器还不支持哦</audio> // ...

  8. 大事记 - 安卓微信浏览器 video 标签层级过高

    // 为什么叫<大事记>? // 以前总有面试官问这样一个问题:“你在项目中遇到过最头疼的问题是什么,是怎么解决的?” // 当时总觉得,已解决的问题都算不上头疼,所以回答总是不尽人意. ...

  9. h5直播开发之旅总结

    前言 关于直播,有很多相关技术文章,这里不多说. 作为前端,我们比较关心我们所需要的. 直播的大致流程: APP端调用摄像头 -> 拍摄视频 -> 实时上传视频 -> 服务器端获取视 ...

随机推荐

  1. mesg命令帮助文档(ubuntu 18.04)

    MESG() User Commands MESG() NAME mesg - display (or do not display) messages from other users SYNOPS ...

  2. c# 读取excels

    DataTable ExcelTable;            DataSet ds = new DataSet();            //Excel 文件一般都保存为统一的xls的连接  其 ...

  3. wordpress网站分类目录怎么排序

    1.插件实现分类目录排序.安装插件My Category Order 启用插件,在控制面板的文章菜单下就出现如下图所示的目录调整选项,可以用鼠标随意拖曳调整目录排列顺序. 2.修改代码完成wordpr ...

  4. Kaldi的交叉熵正则化

    xent_regularize, Cross Entropy Regularize nnet3/nnet-discriminative-trainning.cc:109 void NnetDiscri ...

  5. webpack指定第三方模块的查找路径

    通常我们会使用一些地方模块在我们的项目中,比如bootstrap import 'bootstrap' 导入的bootstrap默认会查找当前目录的node_modules文件,但是如果这个文件没有, ...

  6. BigDecimal实现末尾去掉无用0

    BigDecimal 原生提供了 stripTrailingZeros 方法可以实现去掉末尾的 0,然后使用 toPlainString 可以输出数值,注意这里如果使用 toString()  会变成 ...

  7. FLASK-----基本知识(一)

    中文文档(http://docs.jinkan.org/docs/flask/) 英文文档(http://flask.pocoo.org/docs/0.11/) FLASK介绍 Flask是一个基于P ...

  8. [转] 一文弄懂神经网络中的反向传播法——BackPropagation

    在看CNN和RNN的相关算法TF实现,总感觉有些细枝末节理解不到位,浮在表面.那么就一点点扣细节吧. 这个作者讲方向传播也是没谁了,666- 原文地址:https://www.cnblogs.com/ ...

  9. 内核中dump_stack()的实现,并在用户态模拟dump_stack()【转】

    转自:https://blog.csdn.net/jasonchen_gbd/article/details/44066815?utm_source=blogxgwz8 版权声明:本文为博主原创文章, ...

  10. BIM平台 http://gzcd.bim001.cn

    BIM平台: http://gzcd.bim001.cn