Я следующий сценарий, используя howler.js и JQuery-UI-1.8.21.custom.min.js:Howler.js продолжительность OnLoad
$(function(){
var sounduser1 = new Howl({
urls: ['studio/keysintheair.mp3', 'studio/keysintheair.ogg'],
buffer:true,
volume: 1.0,
onend: function() {
$('.buttons').fadeIn();
},
});
var sounduser2 = new Howl({
urls: ['studio/keysintheair-original.mp3'],
buffer:true,
volume: 0.1,
});
var thisArray = {
user1: sounduser1,
user2: sounduser2
};
$.each(thisArray, function(key,value) {
$('.buildplayer .player').clone().attr('id',key).appendTo('#song');
$('#song .player:last .waveform').css("width", value._duration + "px");
$('#song .player:last .slider').slider({
value: value.volume() * 100,
range: "min",
animate: true,
orientation: "horizontal",
//Slider Event
slide: function(event, ui) { //When the slider is sliding
var now_id = $(this).parent().parent('.player').attr('id');
thisArray[now_id].volume(ui.value/100);
},
});
});
$('.mainplayer .trackslider').slider({
value: 0,
range: "min",
animate: true,
orientation: "horizontal",
//Slider Event
slide: function trackslider(event, ui) { //When the slider is sliding
var audiogetlength = Object.keys(thisArray).map(function (key) { return thisArray[key]._duration; });
var longest = Math.max.apply(null, audiogetlength);
var dividedlength = 100/ui.value;
$.each(thisArray, function(key, value) {
value.pos(longest/dividedlength);
if (ui.value > value._duration) {
value.stop();
}
});
},
});
setInterval(function starttrackslider() {
var dividedslider = sounduser1._duration/sounduser1.pos();
$('.trackslider').slider('value', 100/dividedslider);
},1000);
//Single Audio Track Player
$('.ex1-play').on('click', function(){
var now_id = $(this).parent().parent('.player').attr('id');
thisArray[now_id].stop().play();
});
$('.ex1-stop').on('click', function(){
var now_id = $(this).parent().parent('.player').attr('id');
thisArray[now_id].stop();
});
$('.ex1-loop').on('click', function(){
var now_id = $(this).parent().parent('.player').attr('id');
thisArray[now_id].loop(true);
});
//Main All Track Player
$('.main-play').on('click', function(){
$.each(thisArray, function(key, value) {
value.stop().play();
$('.buttons').fadeOut();
});
});
$('.main-pause').on('click', function(){
$.each(thisArray, function(key, value) {
value.pause();
});
});
$('.main-stop').on('click', function(){
$.each(thisArray, function(key, value) {
value.stop();
$('.buttons').fadeIn();
});
});
$('.main-loop').on('click', function(){
$.each(thisArray, function(key, value) {
value.loop(true);
});
});
});
В последней части $('.mainplayer .trackslider').slider({ });
вы найдете if (ui.value > value._duration) {value.stop();}
value
равняется Завывание называется sounduser2
Оба аудиотреков начинаются в то же самое время. Использование слайдера заставит меня пропустить аудио. Ползунок будет иметь длину самого длинного аудиотрека - который называется Howl под названием sounduser1
. Использование ползунка вернет номер, который активирует положение аудио.
Если ползунок возвращает число, большее, чем фактическая длина аудиотрека, он должен остановить более короткий аудиотрек.
По какой-то причине это не остановит игру, хотя ситуация правильная. Есть ли кто-нибудь, кто знает, что делать?