Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.12.2019, 16:34
Новичок на форуме
Отправить личное сообщение для VolKTieR Посмотреть профиль Найти все сообщения от VolKTieR
 
Регистрация: 19.12.2019
Сообщений: 4

Кнопка нажатия/отжатия паузы для нескольких аудио
Здравствуйте! Я написал такой вот код:
<div class="container">
	<ul class="actions special">
		<li><a href="#one" class="button primary scrolly">
			<button  href="#one" class="button primary scrolly" onclick="document.getElementById('audio').play()">Начать</button>
			</a>
		</li>
         </ul>
</div>

<audio id="audio">
	<source src="audio/1.mp3" type="audio/mpeg" >	
</audio>
<audio id="audio2">			
	<source src="audio/2.mp3" type="audio/mpeg" >	
</audio>
<audio id="audio3">
	<source src="audio/3.mp3" type="audio/mpeg" >	
</audio>
<audio id="audio4">
	<source src="audio/3.mp3" type="audio/mpeg" >	
</audio>
<button  href="#two" class="goto-next scrolly" onclick="document.getElementById('audio2').play()">Next</button>
<button  href="#three" class="goto-next scrolly" onclick="document.getElementById('audio3').play()">Next</button>
<button  href="#four" class="goto-next scrolly" onclick="document.getElementById('audio4').play()">Next</button>


<div class="fixedbut" id="sebut" ></div>




<script>
    document.getElementById("sebut").onclick = function()
    {
      var audio1 = document.getElementById("audio");

      if(audio1.paused == true) 
      {
        document.getElementById("audio").play();
      }
      else if (audio1.paused == false)
      {
        document.getElementById("audio").pause();
      }
    }
</script>


Подскажите пожалуйста, как правильно построить скрипт, чтобы кнопка под айди "sebut" ставила на паузу и снимала с неё любое включенное аудио кнопками Начать и next, и если аудио какой-либо из кнопок Начать или Next уже включено, то при нажатии на их подобную оно останавливалось и начиналось другое.
P.S. "sebut" - постоянная кнопка, висит в углу экрана)
Ответить с цитированием
  #2 (permalink)  
Старый 25.12.2019, 23:41
Аватар для Опан1
Аспирант
Отправить личное сообщение для Опан1 Посмотреть профиль Найти все сообщения от Опан1
 
Регистрация: 10.09.2019
Сообщений: 35

В этом случае проще всего создать и кнопками сначала запускать функцию, которая останавливает все аудио на странице. В JS-код добавьте:
function all_pause(){
	var all_audio = document.getElementsByTagName("audio");
	for(i = 0; i < all_audio.length; i ++) all_audio[i].pause;
}

а 4, 22, 23, 24 строки переписать так:
<button  href="#one" class="button primary scrolly" onclick="all_pause(); document.getElementById('audio').play()">Начать</button>
<button  href="#two" class="goto-next scrolly" onclick="all_pause(); document.getElementById('audio2').play()">Next</button>
<button  href="#three" class="goto-next scrolly" onclick="all_pause(); document.getElementById('audio3').play()">Next</button>
<button  href="#four" class="goto-next scrolly" onclick="all_pause(); document.getElementById('audio4').play()">Next</button>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Один скрипт для нескольких слайдеров DVV Events/DOM/Window 3 16.07.2019 19:17
вставлять переменную в span Hovik Общие вопросы Javascript 17 20.12.2018 08:30
узнать индекс кнопки из массива Hovik Общие вопросы Javascript 0 16.12.2018 02:20
Правильно вызвать массив biryukovm Элементы интерфейса 3 19.03.2018 13:31
Как для нескольких элементов с одним id присвоить style rfhnjirf Элементы интерфейса 3 19.05.2017 10:41