How to play background music in webpages?

Question

When someone opens a webpage, background music should play automatically and UI of music controls or even 1px of video/audio shouldn't visible to user.

Answer 1

<audio src="YOUR_AUDIO_URL" autoplay></audio>

Answer 2

Rowsej Seniru Pasan What does the JUMP_LINK__&&__Python__&&__JUMP_LINK say? It's not working in sololearn and in my mobile browser or Chrome?

Answer 3

What does the JUMP_LINK__&&__Python__&&__JUMP_LINK say? Seniru Pasan
Firstly, In sololearn it's not working that's fine because i had seen recently checked html lesson, lots of people having conversation that they are facing the same problem and some said that autoplay is working fine in pc rather than mobile.
Secondly i had checked my Chrome and other browsers media permission in mobile they were enabled sound or autoplay but it's still I'm facing same problem.
Thirdly, i had checked in all other browsers in mobile and find no results of auto play 😔
Finally, check this websites in your mobile and pc, please let me know whether they are auto played because I don't have pc.(i use mobile for coding)

below are list of sites autoplay when the are opened,
https://econsultancy.com/10-hotel-websites-that-autoplay-sound-to-delight-visitors/

Answer 4

Thanks Jai Verma
Thanks MAHMOUD ABDELNABY MOHAMED ALI GALAL yeah i did still wasn't working

Answer 5

If you don't want to embed a video frame, you can use js.

Please refer to this reference.
https://www.w3schools.com/tags/ref_av_dom.asp

Answer 6

Mellifluous🛡️ Nope! It should work. Web audio API is supported here

Answer 7

Thanks Seniru Pasan by the way please provide me an example template 😃

Answer 8

Autoplay is generally disabled on phones

Answer 9

Mellifluous🛡️ I think dealing with JS is the best idea. Check the link I have posted in upper answers to get a reference.

HINT: All you need in JS is loading the audio and calling play() method. If you wish I could create an example

Answer 10

Use autoplay to make the audio play automatically. Use the loop attribute to make the audio play continuously and use the css display: none; property to hide the UI.

<audio src="YOUR_AUDIO_URL" autoplay loop style="display: none;"></audio>

Answer 11

Seniru Pasan web audio works on my phone but only the autoplay attribute is not working. In the comments in the lesson many other people are saying autoplay is not working on their devices.

Answer 12

Mellifluous🛡️ just gimme 2 days because I m in rush because of the contest 😅. Make sure to remind me.

Answer 13

You can do this by HTML 5 only
and you can do this by HTML 5 And JavaScript

Answer 14

Mellifluous🛡️ it seems like sololearns example also doesn't work on WebKit browsers

https://www.sololearn.com/learn/HTML/2193/

see the autoplay example.

Answer 15

Mellifluous🛡️ from what i read on the web and from what Seniru Pasan is saying it seems like autoplay attribute is disabled in many cases I suppose it's because it can be annoying.

Answer 16

Use angular js to get more control whie playing music

Answer 17

Check your chrome update
Then the aduio well work

Answer 18

In the evening I will message you whole code for same.
This time I'm in office.