Слайдер громкости звука

0

Мне нужна помощь, я не делаю, если я усложняю вещи, но у меня в основном есть музыкальный проигрыватель, у которого есть 2 трека. и я использую ползунок объема. когда я сдвигаю свой ползунок, объем изменится так, как он должен. но когда я нажимаю на следующую для следующего трека, чтобы загрузить громкость сбрасывается на музыкальный проигрыватель. но мое значение слайдера остается неизменным, и если я скрою свои тома после его обновления, он будет обновляться. как я могу заставить музыкальный проигрыватель автоматически установить его объем на мои значения слайдера от начала, когда я нажму дальше.

если этот звук запутан, я помещаю весь свой код здесь, чтобы вы могли его проверить. их двух игроков для каждого трека, поэтому вы можете видеть, о чем они говорят. в основном, если мой шелк перемещается в 0, что означает отсутствие звука. каждый трек должен быть на 0., поэтому, если щелкнуть дальше, то трек должен быть автоматически установлен на 0 после его загрузки.

<!DOCTYPE html>
<html lang ="en">
<head>

    <meta charset="UTF-8">
    <title> My audio test</title>

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
<script type="text/javascript" src="js/jquery11.js"></script>

    <script>
    jQuery(document).ready(function(){



        i=0;
        nowPlaying = document.getElementsByClassName('playsong');
        nowPlaying[i].load();
         volume =($(this).val(.3));
        callMeta();


            $('.play').on('click', function() {     
            nowPlaying[i].play();
            callMeta();
            });

            $('.stop').on('click', function() {
            nowPlaying[i].pause();
            callMeta();
            });

            $('.next').on('click', function() {
                $.each($('audio.playsong'), function() {
                this.pause();
                });
            ++i;
            nowPlaying[i].load();
             nowPlaying[i].volume;
            nowPlaying[i].play();
            callMeta();

            });
            $('.prev').on('click', function() {
                $.each($('audio.playsong'), function() {
                this.pause();
                });
            --i;
            nowPlaying[i].load();
            nowPlaying[i].play();
            callMeta();
            });

            function callMeta() {
                var trackTitle = $(nowPlaying[i]).attr('data-songtitle');
                $('.songtitle').html(trackTitle);
                var trackArtist = $(nowPlaying[i]).attr('data-songartist');
                $('.songartist').html(trackArtist);
                var albumart = $(nowPlaying[i]).attr('data-albumart');
                $('img.albumart').attr('src', albumart);


            }
            $("input[type=range]").val($(this).val()); // set value to 6
$('#volume-bar').change(function(evt) {
        nowPlaying[i].volume =($(this).val()/100);
    $('#newValue').html(nowPlaying[i].volume);
    });

    })
    </script>

</head>
<body>  
<audio class="playsong" controls="controls" data-songtitle="love and fluff" data-songartist="nelly" data-albumart= "img/0qXrGPz.jpg" src="Andy Mineo.mp3">
    Your browser does not support html audio tag
</audio>

<audio class="playsong"  controls="controls" data-songtitle="food for fat kids" data-songartist="chubby" data-albumart= "img/Lecrae_1600x16002-400x400.jpg" src="Derek Minor.mp3">
    Your browser does not support html audio tag
</audio>

<img class="albumart" src="img/Aunrey-avatar.jpeg"></img>
<div class="songartist">song title goes here</div>
<div class="songtitle">song title goes here</div>
<div class="play">Play</div>
<div class="stop">Stop</div>
<div class="next">Next</div>
<div class="prev">Prev</div>
<div class="volume">Volume</div>
<input type="range" id="volume-bar" min="0" max="100" step="0.1" value="100">
<div id="newValue" value="0">0</div>


</body>
</html>
  • 0
    В вашей следующей кнопке обработчик нажатия ... выполняет ли что-то подобное ?: nowPlaying [i] .volume = ($ ('# volume-bar'). Val () / 100)

1 ответ

0
Лучший ответ

Возможно, единственное, что нужно, - это применить уже установленный том - к новой названной песне, взглянуть на изменения:

$('.next').on('click', function() {
        $.each($('audio.playsong'), function() {
            this.pause();
        });
        ++i;
        nowPlaying[i].load();
        nowPlaying[i].volume =($("#volume-bar").val()/100); //changed line
        nowPlaying[i].play();
        callMeta();
 });

 $('.prev').on('click', function() {
        $.each($('audio.playsong'), function() {
            this.pause();
        });
        --i;
        nowPlaying[i].load();
        nowPlaying[i].volume =($("#volume-bar").val()/100); //added line
        nowPlaying[i].play();
        callMeta();
 });
  • 0
    братан, вы спасатель жизни спасибо, это все, что мне нужно было сделать
  • 0
    рад, что это сработало!
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню