<script>
$(document).ready(function(){
let audioList = {
'audio1' : 'https://www.dropbox.com/s/61au3msjadstg8f/Get%20Started%20with%20Dropbox%20Paper.url?dl=0',
'audio2' : 'https://www.dropbox.com/s/61au3msjadstg8f/Get%20Started%20with%20Dropbox%20Paper.url?dl=0',
'audio3' : 'https://www.dropbox.com/s/61au3msjadstg8f/Get%20Started%20with%20Dropbox%20Paper.url?dl=0'
};
for (let track in audioList) {
$('.' + track).find('.tn-atom').html('<audio preload="metadata" controls controlsList="nodownload"><source src="'+audioList[track] + '" type="audio/mpeg"></audio>');
};
let activeAudio = {};
let audioElems = document.querySelectorAll('audio');
for(let i = 0; i < audioElems.length; i++) {
audioElems[i].addEventListener('playing', function() {
if (activeAudio.pause && activeAudio !== this)
activeAudio.pause();
activeAudio = this;
});
}
});
</script>
<style>
audio {
height: 40px;
width:100%;
border-radius: 30px;
box-shadow: 0 0 40px 0 rgb(62 62 62 / 44%);
}
audio::-webkit-media-controls-panel {
background: #bdbdbd;
}
</style>
let audioList = {
'audio1' : 'https://www.dropbox.com/s/61au3msjadstg8f/Get%20Started%20with%20Dropbox%20Paper.url?dl=0',
'audio2' : 'https://www.dropbox.com/s/61au3msjadstg8f/Get%20Started%20with%20Dropbox%20Paper.url?dl=0',
'audio3' : 'https://www.dropbox.com/s/61au3msjadstg8f/Get%20Started%20with%20Dropbox%20Paper.url?dl=0'
};
<style>
audio {
height: 40px;
width:100%;
border-radius: 30px;
box-shadow: 0 0 40px 0 rgb(62 62 62 / 44%);
}
audio::-webkit-media-controls-panel {
background: #bdbdbd;
}
</style>