Audio Object にアクセスする

この記事は約 4 分で読めます。

3.5

<audio>要素を使って再生の際に、
小音量で再生をスタートさせるには
どうしたらよいか調べたところ、

getElementById():を使用

getElementById():を使用して
<audio>要素にアクセスできます。



<audio id="myAudio"></audio>
var audio = document.getElementById("myAudio");
audio.src = "myAudio.mp3";
audio.preload = "none|etadata|auto";
audio.controls = true|false;
audio.volume = 0.0 to 1.0;
audio.loop = true|false ;
audio.autoplay = true|false;
audio.muted = true|false;

単純に、
volume コントロールだけなら、
以下の記述でOKです。

<audio id="myAudio" preload="metadata" controls autoplay loop muted>
<source src="myAudio.mp3" type="audio/mpeg">
</audio>
<script>
document.getElementById("myAudio").volume = 0.2;
</script>

使用上のメモ:

オーディオの音量を指定。
0.0〜1.0の数値である必要があります。
  • 1.0は最高ボリューム(100% これがデフォルトです。)
  • 0.5は半分の体積(50%)
  • 0.0はサイレント(ミュートと同じ)
autoplay属性は preload より優先します。
autoplay を指定すると、
言うまでもなくブラウザーは
音声を再生するために
ダウンロードを始めなければなりません。
POINT

src は、
埋め込む音声コンテンツの URL を指定
します。
なお、
この属性は HTTP access controls に従います。
この属性を省略し、
audio 要素の子要素として配置した
source 要素
その src 属性を用いて指定することも可能であり、
その場合、これを複数設置することで、
異なるタイプの複数の代替コンテンツを
配置することが可能
となります。

 

最後に

貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました

 

Audio Object にアクセスする