微信video最上层解决问题
/* 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最上层解决问题的更多相关文章
- 微信video标签全屏无法退出bug 本文系转载
安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌..强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决.方法就是视频播放完毕后,用音频aud ...
- 微信video标签全屏无法退出bug
安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌..强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决.方法就是视频播放完毕后,用音频aud ...
- 解决微信video全屏的问题,不在本页面播放
在微信浏览器中使用video标签,点击播放会跳出本页面,自动进行全屏播放,原因是自动跳转到手机微信内置的浏览器中去播放去了!!! 在video中加上连个属性就好了,反正最近的一个项目,我是这样做的就好 ...
- html 微信video放大后无法返回问题
android video播放视频放大后无法返回,先debug下debugx5.qq.com 发现用的不是X5内核 直接激活 debugmm.qq.com/?forcex5=true 问题解决 ...
- 《转》完美解决微信video视频隐藏控件和内联播放问题
地址:https://blog.csdn.net/xiao190128/article/details/81025378 var u = navigator.userAgent; var isAndr ...
- 在ios中微信video和audio无法自动播放解决方案
WeixinJSBridgeReady页面初始化的时候会执行 document.addEventListener("WeixinJSBridgeReady", function ( ...
- 微信video和audio无法自动播放解决方案
//音频,写法一<audio src="music/bg.mp3" autoplay loop controls>你的浏览器还不支持哦</audio> // ...
- 大事记 - 安卓微信浏览器 video 标签层级过高
// 为什么叫<大事记>? // 以前总有面试官问这样一个问题:“你在项目中遇到过最头疼的问题是什么,是怎么解决的?” // 当时总觉得,已解决的问题都算不上头疼,所以回答总是不尽人意. ...
- h5直播开发之旅总结
前言 关于直播,有很多相关技术文章,这里不多说. 作为前端,我们比较关心我们所需要的. 直播的大致流程: APP端调用摄像头 -> 拍摄视频 -> 实时上传视频 -> 服务器端获取视 ...
随机推荐
- redis 全局命令 查看所有的键,删除键,检查键是否存在,获取过期时间,键的数据结构类型
Redis有5中数据结构,他们是键值对中的值,对于键来说,有一些通用的命令: 一.查看所有键 keys * 二.获取键总数:dbsize 三.检查键是否存在 exists 如果存在返回1,不存在返回0 ...
- TensorFlow从入门到理解(五):你的第一个循环神经网络RNN(回归例子)
运行代码: import tensorflow as tf import numpy as np import matplotlib.pyplot as plt BATCH_START = 0 TIM ...
- python 的基础 学习 第四天 基础数据类型
1,数字 int 数字主要是用于计算,使用方法并不是很多,就记住一种就可以. #bit_length() 当十进制用二进制表示时,转化为最少二进制的最少位数v = 11data = v.bit_len ...
- windows平台下利用Nginx做负载均衡
1.下载nginx(http://nginx.org/en/download.html)安装包,解压,并使用cmd命令转到nginx.exe所在的目录 2.执行cmd命令start nginx启动ng ...
- day 11 - 1 装饰器
装饰器 装饰器形成的过程:最简单的装饰器——有返回值的——有一个参数——万能参数装饰器的作用:不想修改函数的调用方式 但是还想在原来的函数前后添加功能原则:开放封闭原则语法糖:@装饰器函数名装饰器的固 ...
- 【报错】java.lang.IllegalStateException: ContainerBase.addChild: start: org.apache.catalina.LifecycleException: Failed to start component [StandardEngine[Catalina].StandardHost[localhost].StandardContext[
报错 java.lang.IllegalStateException: ContainerBase.addChild: start: org.apache.catalina.LifecycleExce ...
- 02、natapp的使用
使用方法 官网: https://natapp.cn 命令启动:natapp -authtoken=***************** 文档:https://natapp.cn/article/nat ...
- 一看就懂——利用getJSON()与each()方法动态创建内容
一个案例——忘记的时候可以翻阅参考↓<务必放在服务器内才能看效果哟~> html文件内容如下↓ <!DOCTYPE html> <html> <head& ...
- C&C++动态分配内存(手动分配内存)三种方式
1. malloc函数 函数原型:void *malloc(unsigned int size)函数的作用是:在内训的动态存储区开辟一个size个字节的连续空间,返回所分配区域的首字节地址. 可以看到 ...
- centos 秘钥登陆配置
准备:2台机器,ip分别为:10.1.80.13 10.1.80.14 目的:通过13 ssh远程访问14.无需输入密码 1.首先在10.1.80.13上生成密钥对.cd /root/.ssh ...