audio  new : 音声

カテゴリ

説明

pictureと同様に、sourceを上から順にフォールダウンし、利用可能なものが無い場合は最後の透過的な要素を表示する。

今は既にライブラリが結構出回っていて、ブラウザのデフォルトの操作パネルではなく独自のパネルを使いたいとか、ブラウザ毎に違うのは嫌だとかの要件がある場合はhtml5 player javascript辺りで検索してみると良い。

自動再生(主にautoplay属性)について注意事項。今後は、Chrome 70以降でWAIの影響で、ユーザーによっては音声が再生されなくなる（初期がミュートになる）ので注意。音を鳴らすためにはユーザーのアクションが必要。

属性 属性値の見方

autoplay(真偽値)edge △ ie △ safari ✗ ios ✗
再生可能になったら自動的に再生を開始する。
controls(真偽値)
再生、一時停止、音量調整、早送り等のコントローラを表示。指定が無い場合はBGM的になる。
crossoriginanonymous|use-credentialsie ✗
オリジンをまたいでリンク先リソースを取得する場合に、以下の通り情報を付与する。CORS。
  • anonymous: HTTP Originヘッダー有り/CookieやBASIC認証情報等の信用情報無し
  • use-credentials: HTTP Originヘッダー有り/CookieやBASIC認証情報等の信用情報有り
  • 指定なし: HTTP Originヘッダー無し
disableRemotePlayback  未来(真偽値)
リモート再生を禁止し、UIを非表示にする。たぶんRemote Playback APIを禁止するという事。未調査。

仕様書内で唯一大文字を含む属性（そもそも属性名は大文字小文字を区別しないが）。

loop(真偽値)
ループ再生。
muted(真偽値)
ミュート。
preloadnone|metadata|autosafari ✗ android ✗
ブラウザにプリロードに関するヒントを与える。autoplay属性の指定がある場合はそちらが優先される。
  • none: プリロードしない。
  • metadata: 音声の長さとかチャプターとかのメタデータ部分をプリロード。
  • auto: プリロード時点でファイル全体のダウンロードを開始。指定無しの場合はこれになる。
デフォルト値はブラウザの自由だが、metadataだとみんなハッピーだよねっていう緩めの書き方になっている。
src[URL]
mediagroup
HTML5で追加されたけど廃止された