HTML5视频插件,各种已解决和正在解决的问题
来源:互联网 发布:php超链接输出成文本 编辑:程序博客网 时间:2024/06/07 12:28
最近在做一个hmlt5的课件项目,客户需要在课件中嵌入HTML5视频,还需要自定义视频的一些控制,默认的视频控制条肯定不能满足,于是需要引入自定义的视频控件。
经过一番研究,最后选定了mediaelement这个插件,号称还是挺强的,而且支持的平台比较多。
引入了,首先需要解决的问题是整合问题,它是基于jquery的,我们现在用的包是zepto,虽然号称是通用的,但是用起来就知道区别了。
首先我们自己build的包,发现一些selector的匹配方法不支持,原来selector的包没有build进来,于是又把selector,build进类库里。
又解决了一些兼容性问题,这个lib总算可以正常运行起来了,用一个简单例子测试,感觉蛮好。
放到真正的课件里发现问题了,发现好多按钮都是错位的,经过一番研究发现了问题。视频是通过动画效果出来的,为了动画的效果,视频开始时隐藏的,在获取视频的高度和宽度都没有,造成了位置计算的错误。为了解决这个问题,让动画执行结束之后增加一个回调,在回调里重新计算一下所有按钮的位置,搞定!
解决了这个问题接下来弄一些控制的定制,这个还算顺利,因为大部分的控制功能都是可定制的,只有一个进度条的拖动的可定制功能没有,自己加了参数的接口。
各个浏览器试了一下,基本没啥问题,总算出了一口气,但是还不能高兴太早,还要试试手机上,因为手机上往往是出问题最多的。
果然不出所料,手机上确实问题不少,首先是定位的问题,手机上的课件都是缩放过的,通过zepto的height和width方法得到的也都是缩放过的尺寸,都怪该死的getBoundingClientRect方法,不知道jquery里是不是用的这个方法了处理的。为了避免这个问题,使用了offsetHeight和offsetWidth来代替这两个方法,一试,果然奏效了。
目前还有好多问题在解决中,android设备chrome浏览器,视频对fixed的熟悉竟然不支持,外层div定位过去了,视频还在原处,天哪!
有时候做移动webapp的开发真的挺苦逼的,各种平台,各种浏览器。关键是客户还不理解,有些事情跟他说不通,好吧,我承认我是来发牢骚的。主要是希望大家能理解,也希望有相同经历的朋友一起交流,一起解决苦逼bug,一起交流心得。如果你想体验下,我可以转给你些项目试试,我qq398906783
- HTML5视频插件,各种已解决和正在解决的问题
- 【译】解决HTML5 MP4(H.264)视频模糊的问题
- 解决eclipse各种插件依赖性问题
- 我的问题已解决
- 解决wptouch插件播放视频问题
- 解决网卡正在获取网络地址的问题
- [解决网络出现“正在连接”的问题]
- 最近正在解决的wince问题
- ubuntu的系统升级遇到的问题和解决方案(已解决)
- 解决html5 / cocos2d-html5乱码的问题
- [已解决]MyEclipse导入Web项目后各种红色xx的问题 F3快捷键失效问题.
- 解决过的各种问题
- 解决PersistentLayer插件和HorizontalSliderShow插件无法共用的问题
- ubuntu视频插件解决
- 【已解决】Android studio 打包released 包,各种can`t find referenced method xxxxx的问题。
- opencv视频逐帧处理时结果显示不了的问题已解决
- oracle双实例单监听的各种问题和解决
- oracle双实例单监听的各种问题和解决
- iOS POST请求
- (24)动态扩展数组边界
- 10300 - Ecological Premium
- 自定义ViewGroup实现水平滑动
- 关于思考VirtualAlloc申请的内存属性的问题
- HTML5视频插件,各种已解决和正在解决的问题
- Redis+Keepalived高可用方案详细分析
- UVa 11991 - Easy Problem from Rujia Liu?
- 快速排序
- java static块异常对类加载的影响
- 降魔篇之springmvc项目开发
- libcurl link-time ssl backend (nss) is different from compile-time ssl backend (openssl)
- Let us learn C in Code <2>
- Centos下安装freesurfer、fsl、matlab