埋め込み型オーディオプレーヤーの作成方法//純粋でないフラッシュ

Question

現在、ユーザーが生成したオーディオコンテンツに基づいてコミュニティを開発中です。オーディオを再生するための基本的な技術は、Soundmanager 2はHTML5です。私たちは SM2オプション jQueryに基づいた独自のプレーヤーインターフェイスを作成しました。

アップロードされたmp3ファイルを埋め込み可能にするために、私は現在適切な技術を探しています。プレイヤーはモバイル機器で再生可能でなければなりません（純粋なフラッシュプレーヤーは除きます）。交通漏れは避けるべきです。

クロスブラウザ（およびクロスデバイス）の互換性とセキュリティに関して組み込み可能なプレーヤースニペットを作成するには、どのような方法が最適ですか？

IMHO、これらのオプションがあります。タグと

• 埋め込み（Facebookの申し出など）
• <script>タグと埋め込み（DOMにプレーヤーのコードを "注入" という）。誤読を避けるために：私はに提供することができ埋め込みコードについて話していますすべてのリンクは（CSS、JS、 画像）

EDIT絶対作って

ただ、短くHTMLマークアップスニペットを提供します私たちの訪問者は、プレーヤーのリモートウェブサイトで使用することができます。はい、YouTubeやSoundcloudのようです。

Answer 1

私はSM2を使用していないので、私はそれについて話すことはできません。

しかし、jQueryがオプションであれば、私はjquery.mb.miniAudioPlayerと幸運を覚えました。これはjPlayerに基づいています。

ここで必要なマークアップ/最小限のコードの例です：

<script type="text/javascript" src="inc/jquery/1.3.2.min.js"></script> 
<script type="text/javascript" src="inc/mbScrollable.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
     $(".audio").mb_miniAudioPlayer({ 
     width:240, 
     inLine:false 
     }); 
    }); 
</script> 

<div id="myScroll"> 
    <a id="m1" 
     class="audio {ogg:'http://www.miaowmusic.com/ogg/Miaow-07-Bubble.ogg', 
     mp3:'http://www.miaowmusic.com/ogg/Miaow-07-Bubble.mp3'}" 
     href="javascript:void(0)">miaowmusic - Bubble (mp3/ogg) 
    </a> 
</div> 

換言すれば、あなたの内訳を使用する（「どのように」this page +クリックで見られるように。）はい、プレーヤコードをDOMに「注入」する<script>タグがあります。