Bonjour.
Je m'initie au JQUERY, mais je cale sur le problème rencontré actuellement avec le lecteur HTML5 avec playlist que j'essaie d'ajouter à une page Web (http://devblog.lastrose.com/html5-audio-video-playlist/) : le code JQUERY que j'utilise a été trouvé sur le Web, mais mon souci provient qu'avec certains navigateurs (EDGE par ex), la lecture se lance dès le chargement de la page, ce que je voudrais éviter.
HTML
JQUERY
Je ne mets pas le CSS, je ne pense pas qu'il soit essentiel à ma question.
Y aurait-il une bonne âme qui sache m'expliquer pourquoi avec certains navigateurs la lecture démarre dès le chargement de la page ? Et comment faut-il y remédier ?
Merci beaucoup.
Modifié par Piteur511 (21 Oct 2019 - 22:45)
Je m'initie au JQUERY, mais je cale sur le problème rencontré actuellement avec le lecteur HTML5 avec playlist que j'essaie d'ajouter à une page Web (http://devblog.lastrose.com/html5-audio-video-playlist/) : le code JQUERY que j'utilise a été trouvé sur le Web, mais mon souci provient qu'avec certains navigateurs (EDGE par ex), la lecture se lance dès le chargement de la page, ce que je voudrais éviter.
HTML
<div id="bloc-audio">
<audio id="audio-playlist" preload="auto" tabindex="0" controls autoplay="false" style="width: 200px; height: 25px;">
<source src="../Mus/musique01.mp3">
</audio>
<div id="cont-playlist">
<ul id="playlist">
<li class="active">
<a href="../Mus/musique01.mp3">
Chanson01
</a>
</li>
<li>
<a href="../Mus/musique02.mp3">
Chanson02
</a>
</li>
<li>
<a href="../Mus/musique03.mp3">
Chanson03
</a>
</li>
</ul>
</div>
</div>JQUERY
$(document).ready(function () {
init();
function init(){
var current = 0;
var audio = $('#audio-playlist');
var playlist = $('#playlist');
var tracks = playlist.find('li a');
var len = tracks.length - 1;
audio[0].volume = .20;
audio[0].play();
playlist.on('click','a', function(e){
e.preventDefault();
link = $(this);
current = link.parent().index();
run(link, audio[0]);
});
audio[0].addEventListener('ended', function(e){
current++;
if(current == len){
current = 0;
link = playlist.find('a')[0];
}else{
link = playlist.find('a')[current];
}
run($(link),audio[0]);
});
}
function run(link, player){
player.src = link.attr('href');
par = link.parent();
par.addClass('active').siblings().removeClass('active');
player.load();
player.play();
}
});
Je ne mets pas le CSS, je ne pense pas qu'il soit essentiel à ma question.
Y aurait-il une bonne âme qui sache m'expliquer pourquoi avec certains navigateurs la lecture démarre dès le chargement de la page ? Et comment faut-il y remédier ?
Merci beaucoup.
Modifié par Piteur511 (21 Oct 2019 - 22:45)
