Playing music on iOS devices

Hey guys!

Spent quite some time figuring out how to play background videos on all mobile devices, especially iPhone. Finally it works, but my equilibrium is not complete cause I can’t make the music play upon a click on my “headphone-play-pause” button.

Works everywhere apart from iOS and I don’t understand why. It’s not an auto play so I don’t think I’m breaking a policy.

Here is my Site and a Share Link

Would really appreciate your help! :webflow_heart:

Below is a custom code I’m using

 #demo {
width: 60px;
height: 60px;
outline: none;

<button onclick="Play()" id="demo"></button>

<audio id="player" playsinline>
 <source src="">

var audio = document.getElementById("player");
audio.volume = 0.5;
var butn = document.getElementById("demo"); = "url( no-repeat";

function Play() {
   if(audio.paused) {
  = "url( no-repeat";

else {
  = "url( no-repeat";