Bonjour,
J'utilise un lecteur audio sur mon site sous forme d'un bouton (lecture/pause) qui s'affiche en iframe.
Quelqu'un pourrait-il m'aider à modifier le code afin que le stream ne se mette plus en cache automatiquement au chargement de la page et également quand le bouton est mis en pause.
La Radio France Info dans le code ci-dessous est un exemple pour tester.
Merci pour vos suggestions !
J'utilise un lecteur audio sur mon site sous forme d'un bouton (lecture/pause) qui s'affiche en iframe.
Quelqu'un pourrait-il m'aider à modifier le code afin que le stream ne se mette plus en cache automatiquement au chargement de la page et également quand le bouton est mis en pause.
La Radio France Info dans le code ci-dessous est un exemple pour tester.
Merci pour vos suggestions !
<!-- BEGIN: --><link rel="stylesheet" href="//stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" /><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta http-equiv="CACHE-CONTROL" CONTENT="NO-CACHE"><style>#audioControl img {width: 100px; height: 100px; text-align: left;} #pause {display: none;} a, a:hover, a:active, a:visited, a:focus {text-decoration:none;} #play{font-size:3.000em; } #pause{font-size:3.000em;} @media(max-width: 520px) {#play{font-size:3.500em; } #pause{font-size:3.500em;} .break {display:none;}} @media(min-width: 521px) {#play{font-size:3.500em;} #pause{font-size:3.500em;}}</style>
<div style="padding:20px;">
<audio id="StreamAudio" >
<source src='http://direct.franceinfo.fr/live/franceinfo-lofi.mp3' type='audio/mpeg' preload="none" />
</audio>
<a id="audioControl" href="#" >
<i class="fa fa-play-circle icon-size" aria-hidden="true" id="play" style="float:center; color: #ff8000;"></i>
<i class="fa fa-pause-circle icon-size" aria-hidden="true" id="pause" style="float:center; color: #ff8000;"></i>
</a><script>var StreamAudio = document.getElementById('StreamAudio'), ctrl = document.getElementById('audioControl'), playButton = document.getElementById('play'), pauseButton = document.getElementById('pause'); function toggleButton() { if (playButton.style.display === 'none') { playButton.style.display = 'block'; pauseButton.style.display = 'none'; } else { playButton.style.display = 'none'; pauseButton.style.display = 'block'; }} ctrl.onclick = function () { if (StreamAudio.paused) {StreamAudio.play();} else {StreamAudio.pause();} toggleButton(); return false; }; </script>
<!-- END: -->