web-dev-qa-db-ja.com

FirefoxでJavaScriptを使用して<audio>を使用する

JavaScriptで制御されるオーディオオブジェクトを使用して、Webサイトにバックグラウンドミュージックを実装しようとしています。 これに関する質問を以前に投稿しました @LazyOneはIISが未知のMIMEタイプを提供せず、VS開発サーバーも提供しません。

サイトをIIS 7サーバーにアップロードしました。oggのMIMEタイプが設定されており、サーバーにアクセスしたサイトが206の部分コンテンツを返したときに( mozilla.org 206応答は正常であり、oggファイルに対して期待されると述べています)、ファイルを直接評価することはFirefoxで正常に機能します(つまり、domain.com/music/file.oggにアクセスすると、ブラウザーで再生されます)。自動再生属性が設定されている場合、ファイルはバックグラウンドで正常に再生されますが、 javaScript経由では再生されません

問題のJavaScriptと関連するhtmlは次のとおりです。

audioMusic.volume = 0.15;

function playMusic(){   
    audioMusic.play();
}

function stopMusic(){
    audioMusic.pause();
}

関連するHTML:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>

  <a href="javascript:void(0)" onclick="playMusic()">on</a>
  <a href="javascript:void(0)" onclick="stopMusic()">off</a>

 <audio id="audioMusic" loop="loop" preload="auto">
   <source src="/Music/music.ogg" type="audio/ogg" />
   <source src="/Music/music.mp3" type="audio/mp3" />   
  </audio>

  <script type="text/javascript" src="/Scripts/music.js"></script>
</body>
</html>

より興味深い事実:

  • playMusic()関数は、Firefoxで呼び出されます。最初にアラートを追加すると、それはオフになりますが、実行できません:audioMusic.play()
  • Document.getElementById( "audioMusic")。play();も試しました。
  • Document.getElementById( "audioMusic")。play()とaudioMusic.play()は両方ともChromeとIEで動作しますが、Firefoxでは動作しません
  • Firefox 5.0.1(最新)を使用しています

質問:FirefoxでJavaScriptを介してオーディオ要素を制御する方法は?

1
broccoli_soup

まあ、Firefoxがそのファイルを再生したくなかった理由はまだわかりませんが、同じ問題が発生している場合は、jPlayerを使用することになりました。以下からダウンロードできます。 http://www.jplayer.org/

TODO:

スクリプトフォルダーにjPlayerファイルを配置し、次のhtmlページを使用してWebサイトにプレーヤーを実装できます。 http://Pastebin.com/mhdt2m7W

必要に応じて、ファイル名とディレクトリ、つまり音楽ファイルの場所とスクリプトフォルダーの場所を必ず変更してください。

幸運を。

0
broccoli_soup

W3CバリデーターでHTMLをテストしましたか? http://validator.w3.org/

また、Firefox 5で音楽を再生するには、通常のオブジェクトタグを使用する必要があると思います。

0
Zonata