手机版bilibili如何打开HTML5播放器

html-css012

手机版bilibili如何打开HTML5播放器,第1张

在浏览器地址栏输入bilibili.com/html/help.html#p。

2.在随后出现的画面中点击 →【试用点我】←,然后点击开启HTML5播放器试用

3.然后随便点一个视频点击HTML5播放器就可以随意飙车了

首先swf就是flash的视频格式。而且flash虽然不说是一统天下,但是现在HTML5的<video>视频播放器刚开始起步,根本不可能替代flash,所以就算你用了HTML5的<video>来做网页,也必须加上Flash做后备,用HTML5<video>的作用在于:现在先写好标签,等过N年之后,<video>越来越强大,到时候你就不用再重新写代码了。但谁都不知道那个“N年”到底是多久。

其次,HTML5支持的视频格式非常有限,目前一般有:

H.264

Ogg Vorbis

WebM

而且各个浏览器分别支持不同格式,除了Chrome,好像没有浏览器能完全支持以上三种HTML5视频格式。你如果仅仅使用HTML5<video>来做网页,估计你的视频网站客户很快就跑光了,因为他们绝大部分没法看你的视频。

HTML5的Audio标签,目前的主流浏览器都支持,只不过各种浏览器对音频的支持的格式不同,当前,audio 元素支持三种音频格式:

IE 9                支持  MP3

Firefox 3.5     支持  Ogg Vorbis、Wav

Opera 10.5    支持  Ogg Vorbis、Wav

Chrome 3.0   支持  Ogg Vorbis、MP3

Safari 3.0       支持  MP3、Wav

html5标签audio的autoplay属性可以设置在页面打开后自动播放。这个属性本来挺好的。但是最近做了一个项目却发现在iphone上无法自动播放。

各种查阅资料后发现原来iphone公司是考虑到用户可能是用手机流量访问的情况,为了用户流量着想,所以需要用户交互后才能播放。虽然苹果公司是出于好心,但是如果网页打开之后还需要一个交互才能听到美妙的背景音乐,那么网站的体验效果自然差了很多。可是这种问题要怎么解决呢?

冥思苦想了很久,终于做了一个艰难的决定。于是乎就这样尝试了一下:

$(function(){

$("#audio")[0].play() 

})

没想到竟然好用!!!

全部的代码是这样

<html>

<head>

<script src="js/jquery.js"></script>

</head>

<body>

<audio id="audio" src="song.mp3" autoplay="autoplay">

您的浏览器不支持audio标签。

</audio>

$(function(){

$("#audio")[0].play()

})

</body>

</html>