HTML5 VIDEO

位置：

若放一个div或图片在html5的video元素的位置上，在win，ipad，android上是有区别的

ipad上

video位置上无论放什么都是无法监听到事件的。

android和window是是可以监听到的。

 

视频格式：

都支持mp4格式，但是必须是h264 code，否则也是不支持的。遇到一个video，在ipad上是不能播放的，而在android上可以播放，但是只有声音没有视频（有播放控制条，有滚动）。很奇怪。

 

touches对象：

使用jquery的bind方法是无法取得event对象的touches对象，所以event.pageX是空的。

必须用javascript的addEventListener才能取得。

 

取得touch的XY值：

在移动设备上，若想要去的touch的XY值，只能通过event.pageX取得。虽然《javascript 高级程序设计》里说可以有event.clientX,和event.screenX,但是这两个值在移动设备上都是undefined。

 

 

自动播放：

移动设备不支持video自动播放。window支持。

 

默认全屏播放：

window（CHROME,FF）支持。移动设备不支持，必须通过点击控制条上的全屏按钮实现。

 

封面：

都可以设置封面。但是有时在ipad上设置了poster也不显示。未知。

 

播放：

可以通过其它元素，如div，image的触发来控制视频的播放和暂停。

 

 

评论

10 楼 flex_莫冲 2015-01-20  

hylxinlang 写道

有声音没图像怎么解决呢 兄台

可能是因为android机器内存不足？

9 楼 hylxinlang 2015-01-12  

有声音没图像怎么解决呢 兄台

8 楼 茜草儿 2013-09-09  

<video controls="controls" autoplay="autoplay" width='100%'>
      <source src="video/movie.ogg" type="video/ogg" />
      <source src="video/movie.mp4" type="video/mp4" />
      Your browser does not support the video tag.
</video>
我的视频文件名称没有空格，有的资料说把controls="controls"去掉就可以了，我去了还是不起作用，不知道具体是什么回事？！！

7 楼 dove19900520 2013-09-08  

flex_莫冲 写道

dove19900520 写道

受教了，不过我还是想问一下，怎么样用video标签让视频在ipad中播放。我做一个手机web开发，遇到的问题就是在iphone中可以正常播放视频，在ipad中就不可以，很奇怪。。。。

你可以

dove19900520 写道

flex_莫冲 写道

dove19900520 写道

受教了，不过我还是想问一下，怎么样用video标签让视频在ipad中播放。我做一个手机web开发，遇到的问题就是在iphone中可以正常播放视频，在ipad中就不可以，很奇怪。。。。

ipad的safari同样支持video标签。若但是不支持默认自动播放video。
若需要通过js播放video，可使用如下语句
$("#" + videoID).get(0).play();

可是我不管怎么试，在ipad中就是播放不了，明明视频路径是对的，在iphone中可以播放的。。。。。

建议你可以给video加上监听事件，
video.addEventListener('loadeddata', initialiseControls, false);
或者loadstart，durationchange，loadeddata，progress，canplay，canplaythrough。
调试看有没有问题。

我想，我已经解决了。我的解决方案是：在为video标签添加属性control属性后，ipad就可以播放视频文件了。

6 楼 flex_莫冲 2013-09-06  

茜草儿 写道

针对“pad上video位置上无论放什么都是无法监听到事件的”这一条，有解决办法吗？

你的视频文件名称包含空格吗？

5 楼 茜草儿 2013-09-06  

针对“pad上video位置上无论放什么都是无法监听到事件的”这一条，有解决办法吗？

4 楼 flex_莫冲 2013-04-23  

dove19900520 写道

受教了，不过我还是想问一下，怎么样用video标签让视频在ipad中播放。我做一个手机web开发，遇到的问题就是在iphone中可以正常播放视频，在ipad中就不可以，很奇怪。。。。

你可以

dove19900520 写道

flex_莫冲 写道

dove19900520 写道

受教了，不过我还是想问一下，怎么样用video标签让视频在ipad中播放。我做一个手机web开发，遇到的问题就是在iphone中可以正常播放视频，在ipad中就不可以，很奇怪。。。。

ipad的safari同样支持video标签。若但是不支持默认自动播放video。
若需要通过js播放video，可使用如下语句
$("#" + videoID).get(0).play();

可是我不管怎么试，在ipad中就是播放不了，明明视频路径是对的，在iphone中可以播放的。。。。。

建议你可以给video加上监听事件，
video.addEventListener('loadeddata', initialiseControls, false);
或者loadstart，durationchange，loadeddata，progress，canplay，canplaythrough。
调试看有没有问题。

3 楼 dove19900520 2013-04-18  

flex_莫冲 写道

dove19900520 写道

受教了，不过我还是想问一下，怎么样用video标签让视频在ipad中播放。我做一个手机web开发，遇到的问题就是在iphone中可以正常播放视频，在ipad中就不可以，很奇怪。。。。

ipad的safari同样支持video标签。若但是不支持默认自动播放video。
若需要通过js播放video，可使用如下语句
$("#" + videoID).get(0).play();

可是我不管怎么试，在ipad中就是播放不了，明明视频路径是对的，在iphone中可以播放的。。。。。

2 楼 flex_莫冲 2013-04-11  

dove19900520 写道

受教了，不过我还是想问一下，怎么样用video标签让视频在ipad中播放。我做一个手机web开发，遇到的问题就是在iphone中可以正常播放视频，在ipad中就不可以，很奇怪。。。。

ipad的safari同样支持video标签。若但是不支持默认自动播放video。
若需要通过js播放video，可使用如下语句
$("#" + videoID).get(0).play();

1 楼 dove19900520 2013-04-11  

受教了，不过我还是想问一下，怎么样用video标签让视频在ipad中播放。我做一个手机web开发，遇到的问题就是在iphone中可以正常播放视频，在ipad中就不可以，很奇怪。。。。