HTML5でMP3ファイルをWEBサイトで表示して再生できるようにする
PR
HTML5では簡単にMP3ファイルを埋め込むことが出来ます
再生用のインターフェイスも自動で作ってくれます
HTML5には、audioタグが追加されました
このタグを使ってMP3ファイルを読み込ませるだけでWEBサイトに音楽プレイヤーが出来ます
DEMO
Music By 魔王魂
http://maoudamashii.jokersounds.com/
audioで使えるパラメータ
パラメータを指定することで動作を制御する事が出来ます srcにファイルのリンク(パス)
<audio src="bgm.mp3" controls autoplay loop preload="none"></audio>
自動再生
autoplay
音声ファイルを自動で再生させます
リピート
loop
音声ファイルをリピート再生、ループ再生させます
プリロード
preload=””
音声ファイルをページが表示された時に事前に読み込ませます
auto none metadata の3つの値を入れます
インターフェイス
controls
インターフェイスを表示させます
背景を消せばBGMにもつかえるし、画像を扱うかのように音声ファイルをWEBページで使えます
音楽系のサイトをしている人のは重宝するのではないかと思います
またwaveとかと違ってMP3は軽量な音声ファイルなので取り扱いやすいのもポイントです
PR
COMMENT