前端笔记

包括模块、常见问题、css效果、js效果等。仅用于方便查找,提高工作效率。

网页视频不能自动播放(加了fullpage,有些浏览器能有些不能)解决方案

《网页视频不能自动播放(加了fullpage,有些浏览器能有些不能)解决方案》

这个网页视频在火狐播放正常的,但是360不能播放。被老板追了好多天,终于找出了原因……

网页代码是这样的

<video autoplay preload="auto" muted="true" loop class="index-video"> <source src="images/indexvd.mp4" type="video/mp4"> <!--<source src="http://www.altecmachinery.com/download/wuzimu.mp4" type="video/mp4">--> 您的浏览器不支持 video 标签。 </video>

 

跟参考网站是一模一样的,参考网站的能正常播放,而我的不能,郁闷了

排查了一下,发现跟页面的fullpage有关。把这个插件的代码删了,视频就能正常播放了。

网上查找了一下,有相关的问题,有解决方案,太好了。收藏了!

 

解决方案

….fullpage({

afterRender: function () {

//playing the video

$(‘video’).get(0).play();

}

…..

写到fullpage内就可以解决-。

真的ok,哈哈哈哈哈~

<video autoplay preload=”auto” muted=”true” loop class=”index-video”> <source src=”images/indexvd.mp4″ type=”video/mp4″> 您的浏览器不支持 video 标签。 </video>

video标签的属性也要注意一下,据说要加上muted(静音)属性才能自动播放,我也不知道为什么……

 



打赏作者: 一分也是爱


您的支持就是我最大的动力
点赞

发表评论

邮箱地址不会被公开。 必填项已用*标注