Bonjour à tous,
j'utilise un code qui me permet via un bouton de lancer/stopper une musique. Malheureusement ce n'est pas l'effet souhaité. J'aimerais que ce bouton pause serve à stopper une musique lancée en autoplay.
Si quelqu'un à une idée, voici le code (la div class="unPlayer" est donc inutile):
Merci pour votre aide et bon week-end,
dh
j'utilise un code qui me permet via un bouton de lancer/stopper une musique. Malheureusement ce n'est pas l'effet souhaité. J'aimerais que ce bouton pause serve à stopper une musique lancée en autoplay.
Si quelqu'un à une idée, voici le code (la div class="unPlayer" est donc inutile):
audio{display:none}
.container {width:500px;}
.unPlayer {
}
.audiocontrols a.play {
width: 200px;
height: 200px;
display: block;
float: right;
background-repeat: no-repeat;
background-image: url(img/4.jpg);
}
.audiocontrols a.pause{
background-image: url(img/5.jpg);
width: 200px;
height: 200px;
display: block;
float: right;}
<audio autoplay>
<source src="audio/sound2.mp3" type="audio/mp3">
</audio>
<div class="container">
<div class="unPlayer">
<audio preload="auto" autobuffer="" controls id="audio1">
<source src="http://beta.rdsign.net/exemple/lecteuraudio/204535_2244250-lq.ogg" type="audio/ogg">
<source src="http://beta.rdsign.net/exemple/lecteuraudio/204535_2244250-lq.mp3" type="audio/mpeg">
<source src="http://beta.rdsign.net/exemple/lecteuraudio/204535_2244250-lq.wav" type="audio/wav">
</audio>
<div class="audiocontrols">
<a href="#" class="playpause play" data-audio="audio1"></a>
<a href="#" class="stop" data-audio="audio1"></a></div>
(function($){
$('.audiocontrols a.playpause').on('click',function(e){
e.preventDefault();
console.log()
if ($(this).hasClass('play')){
$('#'+$(this).attr('data-audio'))[0].play();
$(this).removeClass('play');
$(this).addClass('pause');
}else{
$('#'+$(this).attr('data-audio'))[0].pause(); $(this).removeClass('pause');
$(this).addClass('play');
}
});
$('.audiocontrols a.stop').on('click',function(e){
e.preventDefault();
$('#'+$(this).attr('data-audio'))[0].pause();
$('#'+$(this).attr('data-audio'))[0].currentTime=0;
});
$('.down').on('click',function(e){
e.preventDefault();
$('#'+$(this).attr('data-audio'))[0].volume=Math.max($('#'+$(this).attr('data-audio'))[0].volume-0.1,0);
});
$('.up').on('click',function(e){
e.preventDefault();
$('#'+$(this).attr('data-audio'))[0].volume=Math.min($('#'+$(this).attr('data-audio'))[0].volume+0.1,1);
});
})(jQuery);
Merci pour votre aide et bon week-end,
dh