blog
copyright ©
creamu Inc. All Rights Reserved.
art direction & design: Kunitaka Kawashimo
code, interaction & photography: creamu Inc.
category: Technology

デフォルトのプレーヤーを使わないでスマートフォン用にmp3再生機能をつける方法

Pocket

デフォルトのプレーヤーを使わないで、スマートフォン用にmp3再生機能をつける方法です。 HTML
<img id="btn_player" src="img/btn_player.gif" alt="" width="" height="">
JS
var audio = new Audio();
audio.src = "mp3/sound.mp3"; //mp3のファイルパス
$("#btn_player").toggle(
function () {
audio.play();
},
function () {
audio.pause();
}
);
これで、画像をクリックする度にmp3の再生・停止ができます。 XHTML用には、刺激的なjQueryプラグイン37で紹介したjMP3などを使います。 swfでmp3を再生するので、デフォルトのプレーヤーを使いたくない場合は、swfのdivに背景画像として指定します。 flaファイルも入っているので、サイズを変更する場合はflaファイルでサイズを変更し、swfをパブリッシュします。