微信video标签全屏无法退出bug 本文系转载
安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌。。
强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决。
方法就是视频播放完毕后,用音频audio标签播放一个短音频
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta content="width=640,minimum-scale=0,maximum-scale=5,user-scalable=no" name="viewport" />
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<title>微信video标签全屏无法退出bug</title>
<!-- 调试用 -->
<script type="text/javascript" src="http://10.12.8.161:8081/client/#anonymous"></script>
</head>
<body>
安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的广告视频,非常讨厌。。
强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决。
方法就是视频播放完毕后,用音频audio标签播放一个短音频
<div id="vv" ><video width="640" height="320" class="video1" id='video1' x-webkit-airplay="true" webkit-playsinline="true" preload="auto" src="http://www.w3school.com.cn/example/html5/mov_bbb.mp4"></video><div id="second"></div></div> <audio preload="auto" src="http://static.beetobees.com/music-wx/msg.mp3" id="msgr"></audio>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
var video1=document.getElementById("video1");
video1.play();
setTimeout(function(){
video1.pause();
},800); $("body").click(function() {
$(video1).parent().show();
video1.src = video1.src;
video1.play();
}); var aud = document.getElementById("msgr");
video1.addEventListener('ended', function() {
aud.play();
setTimeout(function(){
var video = $('#vv');
//video.addClass('close');
setTimeout(function(){
//video.hide();
},500);
},1000);
}, false); </script>
</body>
</html>
转载自http://www.cnblogs.com/zhidong123/p/5895322.html
微信video标签全屏无法退出bug 本文系转载的更多相关文章
- 微信video标签全屏无法退出bug
安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌..强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决.方法就是视频播放完毕后,用音频aud ...
- 防止微信浏览器video标签全屏的问题
在微信浏览器里面使用video标签,会自动变成全屏,改成下面就好了,起码可以在video标签之上加入其他元素. <video id="videoID" webkit-play ...
- video自动全屏播放
video自动全屏播放 关于Screen.lockOrientation() https://developer.mozilla.org/en-US/docs/Web/API/Screen/lockO ...
- js控制全屏及退出全屏
js控制全屏及退出全屏,网上很多代码例子,我这里需求和标准的有点出入: 1.当用户点击某按钮,触发iframe下的页面全屏. 2.不允许用户退出全屏. 解决第一点,触发全屏可以按照网上的例子,代码如下 ...
- div的全屏与退出全屏
div的全屏与退出全屏 作用:将div全屏与退出全屏,一般播放器使用较多. html按钮: <button onclick="showFull();"> 全屏 < ...
- android开发:全屏和退出全屏
android开发:全屏和退出全屏 from://http://blog.csdn.net/dyllove98/article/details/8831933 2013-04-21 20:31 413 ...
- Android学习之Android 5.0分享动画实现微信点击全屏效果
Android5.0过渡动画,请看 http://blog.csdn.net/qq_16131393/article/details/51112772 今天用分享动画实现微信点击全屏效果 本文源代码下 ...
- X5内核浏览器video自动全屏解决办法-canvas
最近在做手机端上面播放视频的项目,但是在安卓上面,video的播放是脱离页面,置于最顶层的,所以带来了很多问题,为了解决这个问题,查看了多方资料,写了下面简单的demo,方便以后使用. 下面就是运用c ...
- JS实现元素的全屏、退出全屏功能
在实际开发中,我们很可能需要实现某一元素的全屏和退出全屏功能,如canvas.所幸的是,js提供了相关api用来处理这一问题,只需简单的调用requestFullScreen.exitFullScr ...
随机推荐
- spring配置文件详解--真的蛮详细
spring配置文件详解--真的蛮详细 转自: http://book.51cto.com/art/201004/193743.htm 此处详细的为我们讲解了spring2.5的实现原理,感觉非常 ...
- 编译本地64位版本的hadoop-2.6.0
官方提供的hadoop-2.x版本貌似都是32位的,在64位机子下使用可能会报错,最好使用官方提供的源码进行本地编译,编译成适合本地硬件环境的64位软件包. 关于native Hadoop是使用J ...
- ROS之VPN服务器设置教程.
关于ROS系统的安装此处将不再累述,可以自行谷歌,百度搜索“ROS 安装配置教程”. (安装方法可以使用光盘安装,USB引导安装,硬盘写入.) 好了,演示创建VPN服务器的方法: 1.使用WinBox ...
- LoadRunner监控Linux
rstat协议允许网络上的用户获得同一网络上各机器的性能参数. 需要下载3个包: (1)rsh-0.17-14.i386.rpm (2)rsh-server-0.17-14.i386.r ...
- Object.prototype.toString.call()进行类型判断
为什么类型判断用到Object.prototype.toString.call()进行类型判断,而不用typeof()呢? 然后翻了一下资料: Typeof 在使用 ]));/));));//[obj ...
- Java Annotation自定义注解详解
在开发过程中总能用到注解,但是从来没有自己定义过注解.最近赋闲在家,研究整理了一番,力求知其然知其所以然. 本文会尝试描述什么是注解,以及通过一个Demo来说明如何在程序中自定义注解.Demo没有实际 ...
- Effective Java 读书笔记之三 类和接口
一.使类和成员的可访问性最小化 1.尽可能地使每个类或者成员不被外界访问. 2.实例域决不能是共有的.包含公有可变域的类不是线程安全的. 3.除了公有静态final域的特殊情形之外,公有类都不应该包含 ...
- HDU 5128 The E-pang Palace(2014广州赛区现场赛B题 计算几何)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5128 解题报告:在一个平面上给出n个点的坐标,用这n个点作为矩形的四个顶点,作两个矩形,要求两个矩形不 ...
- [codeforces 339]C. Xenia and Weights
[codeforces 339]C. Xenia and Weights 试题描述 Xenia has a set of weights and pan scales. Each weight has ...
- phpcms常用标签
http://v9.help.phpcms.cn/html/pc_tag/modules/ 9帮助中心 {template "content","header" ...