HTML5技术

video/audio在ios/android上播放兼容 - Jun-Hao

字号+ 作者:H5之家 来源:H5之家 2016-12-27 12:03 我要评论( )

1.audio自动播放 上面是audio标签autoplay属性是自动播放,但是在安卓部分浏览器和ios的safari是不会自动播放。 在微信,安卓和ios大部分机子都可以知道播放。 测试iphone5和iphone6s在升级到相同版本的情况下,iphone5微信可以自动播放,iphone6s不会自动播

1.audio自动播放

  

上面是audio标签autoplay属性是自动播放,但是在安卓部分浏览器和ios的safari是不会自动播放。
在微信,安卓和ios大部分机子都可以知道播放。
测试iphone5和iphone6s在升级到相同版本的情况下,iphone5微信可以自动播放,iphone6s不会自动播放。这种情况可参考:

在易信,ios可以自动播放,安卓不能自动播放。

参考页面需要注意的地方:就是会执行两次函数方法,在易信好像会执行3次的情况,安卓没测试,可以自行测试。

解决方案:

ios:微信、易信自动播放,
安卓:微信自动播放

其他浏览器:设置一个前置页或者按钮引导用户触发事件执行audio的play()方法。

2.video自动播放

  

情况基本和audio一致。有点点小差别就是在安卓易信,视频不会自动播放,需要手动。

那么解决方案里就要把安卓易信也归为上面提到的其他浏览器处理方案。

3.video安卓微信视频播放完隐藏不了,一直保持视频推荐界面的问题进不了下个原要显示界面

(视频推荐界面-图)

 

开始以为视频播放完触发ended事件执行video标签隐藏,结果不行~,会不会ended事件没触发,然后再ended回调函数里放了个alert测试,

测试是有触发到alert的,那么证明ended事件是正常执行的。
然后就想,既然能执行,我就再狠一点,ended之后把video标签整个remove掉。最后最后,还是不行!!

之后就各种查,各种尝试,各种不行。

目前只有把下一个界面通过跳转页面的方式去跳转。location.href = '下一个界面路径'

(希望能有不跳转页面的方法解决这个问题)

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 《HTML5》 Audio/Video全解 - Samcc

    《HTML5》 Audio/Video全解 - Samcc

    2016-12-14 13:00

  • HTML5中Video和Audio - 进击的小前端

    HTML5中Video和Audio - 进击的小前端

    2016-12-01 10:00

  • H5调用Android拨打电话 - ganchuanpu

    H5调用Android拨打电话 - ganchuanpu

    2016-10-26 15:00

  • 基于html5,父级块中添加video,不能全屏播放的问题解决。 - 猕猴桃姑娘

    基于html5,父级块中添加video,不能全屏播放的问题解决。 - 猕猴桃

    2016-10-18 18:00

网友点评
l