html5 video使用autoplay属性时，声音混乱
html5 video使用autoplay属性时，声音混乱
页面代码
Index.html
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test</title>
<meta charset='utf-8'/>
<script src="js/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="js/thml5.js" type="text/javascript"></script>
<script type="text/javascript"> window.onload=function(){
$('#channel1').click(function(){
setConfig("test1.mp4");
}); $('#channel2').click(function(){
setConfig("test2.mp4");
}); $('#channel3').click(function(){
setConfig("test3.mp4");
});
} function setConfig(url){
var jo=$('#test1');
var cfg=HTML5MediaService.getDefaultConfig();
cfg=$.extend(cfg, {url: url});
HTML5MediaService.create(jo,cfg);
} </script>
</head>
<body>
<div id='test1' style="height:300px;width:500px;"> </div>
</br>
</br>
</br>
<div>
<span id='channel1'>频道1</span>
<span id='channel2'>频道2</span>
<span id='channel3'>频道3</span>
</div>
</body>
</html>
js代码
html5.js
var HTML5MediaService= {
getDefaultConfig: function () {
return $.extend({}, {width: "100%", height: "100%", controls: "controls", autoplay: "autoplay"});
},
create:function(jo,cfg){
this.videoId = "videojs_" + new Date().getTime().toString();
var videoJo = $('<video' +
' id="' + this.videoId + '"' +
' src=' + cfg.url +
' controls=' + cfg.controls +
' autoplay=' + cfg.autoplay +
' width=' + cfg.width +
' height=' + cfg.height +
' preload=none' +
'></video>');
videoJo.appendTo(jo.empty());
}
}
我的解决方案：
取掉autoplay，可以使用play()函数来达到自动播放功能；
有不同解决方案的可以分享，谢谢！
html5 video使用autoplay属性时，声音混乱的更多相关文章
- android chrome 不支持 audio/video的autoplay 属性
在chrome 浏览器中输入:chrome://flags,找到"播放媒体时的手势要求",停用就可以了.
- 使用jQuery和CSS自定义HTML5 Video 控件 简单适用
Html5 Video是现在html5最流行的功能之一,得到了大多数最新版本的浏览器支持.包括IE9,也是如此.不同的浏览器提供了不同的原生态浏览器视频空间.我们制作自定义视频控件为了在所有的浏览器中 ...
- 在使用html5的video标签播放视频时为何只有声音却没有图像
在使用html5的video标签播放视频时为何只有声音却没有图像? 答:使用格式化工厂转个编码就行了,MP4有3种编码,mpg4(xdiv),,mpg4(xvid),avc(h264)转换成H264编 ...
- HTML5 video 视频标签 常用属性
最近在做手机端的 h5 页面的视频直播功能,用到了 Video 标签.其常用的属性有以下几个: src.poster.preload.autoplay.loop.controls.width.heig ...
- HTML5的Video标签的属性,方法和事件汇总
<video>标签的属性 src :视频的属性 poster:视频封面,没有播放时显示的图片 preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览 ...
- 【HTML5 video】video标签的部分属性解析
转自:http://www.cnblogs.com/kiter/archive/2013/02/25/2932157.html 现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Th ...
- HTML5 video 视频标签全属性详解
现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.Chrome),支持H.264的(Safari.IE ...
- video标签的属性和方法总结
最近想做一个弹幕插件,查了很多video标签的属性和方法 error属性 在正常读取时候,使用媒体数据的过程中,video元素或audio元素的error属性为null,但是任何时候只要出现错误,er ...
- 移动端HTML5<video>视频播放优化实践
遇到的挑战 移动端HTML5使用原生<video>标签播放视频,要做到两个基本原则,速度快和体验佳,先来分析一下这两个问题. 下载速度 以一个8s短视频为例,wifi环境下提供的高清视频达 ...
随机推荐
- MySQL 当记录不存在时insert，当记录存在时update(ON DUPLICATE KEY UPDATE, REPLACE语句)
MySQL 当记录不存在时insert,当记录存在时更新 网上基本有三种解决方法. 第一种:示例一:insert多条记录 假设有一个主键为 client_id 的 clients 表,可以使用下面的语 ...
- 根据当前日期算前一年、前一月、前一天(java基础)
问题的本身没有什么难度,但是要想一下子找到一个现成的方法还真不是那么容易,本来以为java.util.Date中会有方法结果找了半天没找到,最后还是在Calendar中找到了,记下别忘了!! 核心:使 ...
- oracle 11g r2 rac +openfiler 2.99 +centos 6.5+vbox
继上篇openfiler 2.99安装之后,这一篇讲介绍openfiler的存储配置和oracle 端的服务配置 参考文档:https://www.oracle.com/technetwork/cn/ ...
- AD9如何设置原点位置
Edit --> Origin --> Set
- python's fourth day for me 列表
break 可以打断 for 循环不执行 else 语句 s = 'fdddsadwes' for i in s: if i == 's': break #可跳出for循环且不用执行else语句 pr ...
- 【DevExpress】1、SearchLookUpEdit详解
一.属性的基本介绍: 绑定数据源: lookUpEdit.Properties.ValueMember = 实际要用的字段; //相当于Editvalue lookUpEdit.Propertie ...
- 第七章 AOP（待续）
···············
- C51串口的SCON寄存器及工作…
原文地址:C51串口的SCON寄存器及工作方式作者:batistar 一,串行口控制寄存器SCON 它用于定义串行口的工作方式及实施接收和发送控制.字节地址为98H,其各位定义如下表: D7 D6 D ...
- IAR FOR ARM 各版…
用过Keil和IAR,个人感觉是IAR还是很不错的.下载地址是: http://files.iar.com/ftp/pub/box/CD-EWARM-6301-3142.zip V6.30.1(该地址 ...
- windows 共存多个位数不同的jdk时，eclipse的报错对应措施
1. 判断当前jdk的位数 # java -version java version "1.6.0_26" Java(TM) SE Runtime Environment (bui ...