自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

如何在網(wǎng)頁中應(yīng)用HTML 5音頻

開發(fā) 前端
世界上公認(rèn)的第一個網(wǎng)頁是誕生于1992年,發(fā)展至今,網(wǎng)頁已經(jīng)有21年歷史了。在這21年里面,網(wǎng)頁開發(fā)的標(biāo)準(zhǔn)從沒有完全統(tǒng)一過。而我們經(jīng)常見到的web音頻就是這么樣子的?,F(xiàn)在,大部分的網(wǎng)頁音頻播放依靠著flash,但是顯然地,flash已經(jīng)越來越不適用于web開發(fā)。所以呢,蘋果放棄了flash,而Android也宣布不再支持flash。主要原因就是HTML5的誕生,為web開發(fā)提供了更加便捷、高效的音頻應(yīng)用。那么,在網(wǎng)頁中HTML5音頻或者說HTML5播放器是怎么應(yīng)用的呢。

HTML5 audio

在HTML5標(biāo)準(zhǔn)網(wǎng)頁里面,我們可以運(yùn)用audio標(biāo)簽來完成我們對聲音的調(diào)用及播放。以下是最經(jīng)常見到的運(yùn)用HTML5三種基本格式:

1.最少的代碼

  1. <audio src="song.ogg" controls="controls"></audio>   

2.帶有不兼容提醒的代碼

  1. <audio src="song.ogg" controls="controls">   
  2. Your browser does not support the audio tag.    
  3. </audio>   

3.盡量兼容瀏覽器的寫法

  1. <audio controls="controls">   
  2.   <source src="song.ogg" type="audio/ogg">   
  3.   <source src="song.mp3" type="audio/mpeg">   
  4. Your browser does not support the audio tag.    
  5. </audio>  

HTML5音頻格式

當(dāng)前,HTML***udio標(biāo)簽支持三種格式的音頻,分別是wav mp3和ogg格式。而目前主流瀏覽器對他們的支持如下:

  IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0
Ogg Vorbis    
MP3    
Wav    

IE8以及IE8以下不支持HTML5的audio標(biāo)簽

HTML ***udio屬性

1.autoplay:***可選值為autoplay,出現(xiàn)autoplay屬性并準(zhǔn)確賦值時,音頻將會自動播放

2.controls:***可選值為controls,出現(xiàn)controls屬性并準(zhǔn)確賦值時,音頻播放控件將會顯示,控件包括:播放、暫停、定位、音量、全屏切換、字幕(如果可用)、音軌(如果可用)。

3.loop:***可選值為loop,出現(xiàn)loop屬性并準(zhǔn)確賦值時,音頻將會循環(huán)播放。

4.preload:可選值有auto(當(dāng)頁面加載后載入整個音頻)、meta(當(dāng)頁面加載后只載入元數(shù)據(jù))和none(當(dāng)頁面加載后不載入音頻) 如果設(shè)置了前面的autoplay屬性,那么preload將會被忽略。

5.src:指定音頻URL地址,可以是相對的URL也可以是絕對的URL 當(dāng)然還可以像第2和第3個例子一樣,用source標(biāo)簽來指定源。

原文鏈接:http://www.itluren.com/apply-html5-audio-to-web.html

【編輯推薦】

  1. 8個效果驚人的WebGL/JS演示
  2. WebGL: 為瀏覽器提供3D顯示支持
  3. JavaScript,只有你想不到
  4. 如何優(yōu)化你的JS代碼
  5. 另一款有意思的JS圖片放大鏡

 

 

責(zé)任編輯:彭凡 來源: IT路人
相關(guān)推薦

2025-04-07 00:00:01

Canvas渲染圖片HTML

2022-12-25 17:49:55

Ubuntu媒體音頻Linux

2014-06-26 16:05:53

2012-04-27 14:34:15

2017-08-09 15:57:11

JavaScriptHtml5音頻

2012-01-11 16:00:50

HTMLOperaAPP

2009-06-02 10:02:50

eclipse jboeclipse jbojboss for e

2021-07-02 20:37:19

Python代碼SRP

2009-07-06 00:01:51

HTML 5元素

2020-03-31 21:50:41

JavaScript前端技術(shù)

2022-07-15 09:01:15

React對象編程

2010-07-27 09:44:16

HTML 5

2009-07-02 15:01:07

HTML 5

2011-06-02 17:21:52

網(wǎng)站優(yōu)化關(guān)鍵詞

2012-12-10 09:49:28

2022-08-03 10:45:04

人工智能網(wǎng)絡(luò)安全

2013-08-07 14:48:00

HTML5

2023-08-15 15:15:24

2012-12-07 10:20:56

IBMdW

2012-05-09 09:41:58

HTML5
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號