« WordPressのカスタマイズ | トップページ | ページ内のMP3ファイルを連続再生させるブックマークレット »

2008年12月 9日 (火曜日)

Yahoo! Media PlayerはMP3ファイルへのリンクだけでOK

 かっこいいWebサイト用プレイヤー。それがYahoo! Media Player。

 aタグだけでMP3ファイルへのリンクを貼ると、ブラウザの設定やインストールされてるプラグインによって、それなりに再生されるわけだけれども、見た目はあんまりよくない。

 複数のMP3ファイルへのリンクが羅列してあった場合は、それぞれのリンクをクリックして再生、元のページに戻って、またリンクをクリックして再生、とかいうのがめんどくさい。

 そういう面倒を一発で解決してくれるのがYahoo! Media Playerだ。

 ページのソースに1行だけ、JavaScriptのコードを貼り付ける。それだけで、

 ・aタグで貼ったMP3ファイルへのリンクに再生ボタンがつく
 ・再生ボタンを押すと再生用のパネルが開く
 ・パネルからはページ内のMP3ファイルの連続再生が可能

Ymm01

 上の画像(クリックで拡大)でいうと、赤い四角がふつうにaタグでMP3ファイルをリンクしたリスト。でもって、JavaScriptによって追加されたのが緑の四角で囲んだ再生ボタン。さらにその下にある半透明のやつが再生をコントロールするパネル。リンクのぶんだけプレイリストが表示される。

 ブログなどのCMSだと、全ページにJavaScriptのタグを入れるのなんてカンタンなわけで、手間なくサイトのMP3再生環境をグレードアップできるというわけだ。
 ココログだと、マイリストにでもつっこんでおけばいいだろう(改行を反映させない設定にするのがポイントか?)。

 というわけで、いまごろ知って興奮してるわけですが、ぜひ、自分でも紹介しておきたい、ということで書いてみました。配布サイトは以下。当然、動作も体験できる。

 Yahoo! Media Player(Yahoo!のサイト、当然英語)

 このプレイヤーを使ってるサイトなんてのも紹介されています。

 MP3ファイルのWebでの再生方法を調べていたら、embedタグでsrc属性指定、とか見つけたんだけども、これだと使えない環境も多いということで、見つけたのが、これだったり。

 FlashとJavaScriptなら、最近のブラウザなら問題ないだろうし、ということで。このへんメモ。

 で、自分のサイトならカンタンに設置ができるわけだけども、そうでないサイトでもこのプレイヤーを使えないものか? というのが次のエントリになるわけです。


|

« WordPressのカスタマイズ | トップページ | ページ内のMP3ファイルを連続再生させるブックマークレット »

コメント

コメントを書く



(ウェブ上には掲載しません)




トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/35726/43371365

この記事へのトラックバック一覧です: Yahoo! Media PlayerはMP3ファイルへのリンクだけでOK:

« WordPressのカスタマイズ | トップページ | ページ内のMP3ファイルを連続再生させるブックマークレット »