web-dev-qa-db-ja.com

非表示のタグでサウンドを再生する

Webページでサウンドを設定しようとしています。

このコードを見つけました。 divが表示されているときに動作するコードですが、非表示にして動作したいです。この場合、style属性で非表示になっているため、機能していません。見えないようにし、同時にサウンドを再生する方法は?

<div style="display:none">
   <embed src="sound.mp3"/> 
</div>
10
theChampion

上記のコメントの感情に同意します—これはかなり迷惑です。ユーザーに音楽をオフにするオプションを提供することのみを希望します。

しかしながら...

HTML

<audio autoplay="true" src="http://www.vorbis.com/music/Epoq-Lepidoptera.ogg">

CSS

audio { 
   display:none;
}

Cssはaudio要素を隠し、autoplay="true"は自動的に再生します。

フィドル ここ

10
couzzi

<audio autoplay> <source src="file.mp3" type="audio/mpeg"> </audio>

自動再生バーは削除されますが、音楽は再生されます。目に見えない音!

5
imaguest

それは私がそれを達成した方法であり、目に見えない(HORRIBLE SOUND ....

<!-- horrible is your mp3 file name any other supported format.-->
<audio controls autoplay hidden="" src="horrible.mp3" type ="audio/mp3"">your browser does not support Html5</audio>
1
meditat

私は自動再生する必要があり、非表示になるオーディオを添付しようとしています。とても簡単です。ほんの数行のHTMLとCSS。これをチェックしてください!!これが私が本文内で使用したコードです。

<div id="player">
    <audio controls autoplay hidden>
     <source src="file.mp3" type="audio/mpeg">
                unsupported !! 
    </audio>
</div>
1
Ruchika BN
<audio id="audio" style="display:none;" src="mp3/Fans-Mi-tooXclusive_com.mp3" controls autoplay loop onloadeddata="setHalfVolume()">

これは、ノイズを避けるためにシステムの音量が大きい場合でも、自動再生し、音楽を隠し、音楽を減らします。これをスクリプトに配置します。

<script>
    function setHalfVolume() {
        var myAudio = document.getElementById("audio");
        myAudio.volume = 0.2;
    }
</script>
0
user5091678

通常、私がすることは、通常の音声タグを配置し、autoplay="true"と私は追加しません:controls = "true"そしてそれは通常私のために動作します

これをスニペットに入れて、jsfiddelも作成しました here

お役に立てれば :)

<audio autoplay="true" 
src="https://res.cloudinary.com/foxyplays989/video/upload/v1558369838/LetsGo.mp3"> 
</audio>
0
Zachary Cross

ボタンのクリックに関しては、音楽などの機能をオフにすることを人々が許可してくれることを願っています。使用

<audio controls autoplay hidden="hidden"> <source src="*file here*" type="*file extension (.mp3 .ogg etc.)*"> <!--This displays an error to users that don't have it supported--> Your browser does not support the audio element. </audio>

ご覧のとおり、私はあまり繰り返したくないのですが、hiddenタグで決定しました。

お役に立てれば。

0
TheCodingKlam