微信内置浏览器在使用video标签时(安卓)默认全屏的原因及解决办法
根据X5论坛得到的答案是:设计如此。
腾讯真是越来越嚣张了,一家独大后用户体验都不注重了(不给程序员留活路)。
听说有个申请加入vdeo白名单的,域名验证后就可以解决默认全屏(反正我是没见过申请入口,不给钱,想进来没门。)
最终的解决办法:
将video转化为canvas,逐帧播放,不过canvas貌似最高可以达到60帧/s,不过页够用了(扯淡:玩LOL起码要150FPS左右);
copy大神的JQ代码(原理都是相通的)如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" >
function play() {
var video = $("#myVideo").get(0).play();
}
function stop() {
var video = $("#myVideo").get(0).pause();
}
$(document).ready(function () {
var video = $("#myVideo");
var _video = video.get(0);
$("#myVideo").bind("play", function () {
drawCanvas();
});
function drawBlock(context, x, y, width, height, color) {
var imageData = context.createImageData(width, height);
var pixelArray = imageData.data,
pixel = null;
for (var m = 0, length = pixelArray.length; m < length; m += 4) {
pixelArray[m] = pixelArray[m + 1] = pixelArray[m + 2] = pixelArray[m + 3] = color;
}
context.putImageData(imageData, x, y);
}
function drawCanvas() {
if (_video.paused || _video.ended) {
return;
}
var canvas = $("#canvas");
var _canvas = canvas.get(0);
var context = _canvas.getContext("2d");
context.drawImage(_video, 0, 0, 640, 360);
setTimeout(drawCanvas, 30);
}
});
</script>
</head>
<body>
<center>
<hr />
<video width="640" height="360" id="myVideo" controls>
<source src="movie.ogg" ></source>
</video>
<canvas width="640" height="360" id="canvas">
</canvas>
<button onclick="play()" >play</button><button onclick="stop()">stop</button>
<hr />
<video width="640" height="360" controls>
<source src="movie.ogg" ></source>
</video>
</center>
</body>
</html>
微信内置浏览器在使用video标签时(安卓)默认全屏的原因及解决办法的更多相关文章
- 微信内置浏览器UserAgent的判断
需求分析 现在微信火了,很多线上的APP都希望通过分享的URL或直接的URL进行产品宣传(写这篇博文的时候,听说微信下个版本将要屏蔽微信中的URL链接),这些链接都将通过微信内置的浏览器打开.PM希望 ...
- 微信内置浏览器不支持 onclick 如何解决?(原因是因为内面中的内容或者标签大部分是动态生成的)
使用了很多onclick事件,但是在Android的微信内置浏览器中,onclick是不能被执行的. 开始的写法是: // $(".contentPic").click(funct ...
- 2017年05月10日记一次微项目投产 | 安卓版微信内置浏览器不能解析gzip压缩过的mp4视频的问题
前言 今天投产了一个小项目,一个很简单的H5,有播放视频功能,使用了videojs插件. 之前也做过数个视频播放,视频的转压都按照既定流程进行,文件放到FTP后,iphone和安卓机测试下来都没有问题 ...
- 微信内置浏览器私有接口WeixinJSBridge介绍(转)
这篇文章主要介绍了微信内置浏览器私有接口WeixinJSBridge介绍,本文讲解了发送给好友.分享函数.隐藏工具栏.隐藏三个点按钮等功能,需要的朋友可以参考下 微信网页进入,右上角有三个小点,没错, ...
- 微信内置浏览器私有接口WeixinJSBridge介绍
原文地址:http://www.3lian.com/edu/2015/05-25/216227.html 这篇文章主要介绍了微信内置浏览器私有接口WeixinJSBridge介绍,本文讲解了发送给好友 ...
- 微信内置浏览器的JS API
/**! * 微信内置浏览器的Javascript API,功能包括: * * 1.分享到微信朋友圈 * 2.分享给微信好友 * 3.分享到腾讯微博 * 4.新的分享接口,包含朋友圈.好友.微博的分享 ...
- 微信内置浏览器WebApp开发,踩坑 · Issue #31 · maxzhang/maxzhang.github.com · GitHub
最近花6天时间完成了一个七夕的小活动,是一个简单的WebApp.由于我前期对面向微信的Web开发评估不足,导致开发过程十分艰难.写这篇文章总结下,惊醒自己未来不要再犯这样的错误. 问题: 1. 有些比 ...
- 微信内置浏览器的JsAPI(WeixinJSBridge续)[转载]
原文地址: http://www.baidufe.com/item/f07a3be0b23b4c9606bb.html 之前有写过几篇关于微信内置浏览器(WebView)中特有的Javascript ...
- 微信内置浏览器的 User Agent的判断
如何判断微信内置浏览器,首先需要获取微信内置浏览器的User Agent,经过在 iPhone 上微信的浏览器的检测,它的 User Agent 是: Mozilla/5.0 (iPhone; CPU ...
随机推荐
- 安卓开发 1配置环境 (JDK+Andriod stiuio)
配置JDK+Andriod stiuio 所需要用到的JDK和AS 链接:https://pan.baidu.com/s/1smHCD1z密码:rxh2 1 JAVA_SDK 1.1 下载 htt ...
- Oracle 11g rac 添加新节点测试
[转]https://blog.csdn.net/shiyu1157758655/article/details/60877076 前期准备: 操作系统设置OS版本必须相同,检查内核参数,系统内存.C ...
- Kubernetes1.91(K8s)安装部署过程(八)-- kubernetes-dashboard安装
kubernets-dashboard顾名思义是操作面板安装,也就是可视化管理机器,同意我们用镜像结合配置文件部署. 1.下载镜像: docker pull registry.docker-cn.co ...
- 201904:Action recognition based on 2D skeletons extracted from RGB videos
论文标题:Action recognition based on 2D skeletons extracted from RGB videos 发表时间:02 April 2019 解决问题/主要思想 ...
- co模块源码学习笔记
// Sorrow.X --- 添加注释,注释纯属个人理解 /** * slice变量 引用 数组的 slice方法 */ var slice = Array.prototype.slice; /** ...
- VSCode Install Go
首先是VScode官网下载:https://code.visualstudio.com/ 然后在电脑上安装go的环境 如下图在VSCode上搜go的插件进行安装: 推荐:vscode-icons这个插 ...
- http一次请求过程
物理层:支持底层网络协议: 其中网络层支持IP协议: 传输层支持TCP协议,它是面向连接的: 应用层支持 http,ftp tftp,SMTP,DHCP协议 一个完整的http请求过程: 1.浏览器 ...
- Multiple Threads reading from the same file(转载)
问 I have a xml file that needs to be read from many many times. I am trying to use the Parallel.ForE ...
- QueryHelper
[1].[代码] QueryHelper.java 跳至 [1] package my.db; import java.io.Serializable; import java.math.BigInt ...
- OLED小记
1.点阵组成OLED,OLED中有一个GRAM区域,区域中的值直接刷新到屏幕上,对应关系是1bit对应一个像素点: 2.要点亮一个像素点,只需要将GRAM中的对应bit位写1即可.GRAM中是分页来管 ...