Вырваться из-под контроля

Вырваться из-под контроля

Элемент audio можно использовать не только для злых, но и для благих целей. Дать пользователю контроль над управлением проигрывания аудиофайла – здравая идея, которую легко осуществить с помощью булева атрибута controls:

<audio src="witchitalineman.mp3" controls>

</audio>

Присутствие атрибута controls заставляет браузер отобразить встроенные элементы управления того, чтобы проигрывать аудиофайл и ставить его на паузу – и для того, чтобы настраивать громкость (рис. 3.05).

Рис. 3.05. Используйте атрибут controls, для того чтобы отобразить элементы управления «проиграть», «пауза» и управления громкостью

Если вам не нравятся встроенные в браузер элементы управления, можете создать свои собственные. С помощью JavaScript вы можете взаимодействовать с Audio API, которое дает вам доступ к методам (play и pause) и свойствам (volume и др.). Вот быстрый и простой пример, как использовать элементы button и ужасные обработчики событий, написанные прямо в коде страницы (рис. 3.06):

<audio id="player" src="witchitalineman.mp3">

</audio>

<div>

<buttononclick="document.getElementById(‘player’). play()">Проиграть

</button>

<buttononclick="document.getElementById(‘player’). pause()">Пауза

</button>

<buttononclick="document.getElementById(‘player’). volume+= 0.1">

Громче

</button>

<buttononclick="document.getElementById(‘player’). volume-= 0.1">

Тише

</button>

</div>

Рис. 3.06. Элементы управления (Проиграть, Пауза, Громче, Тише), сделанные с помощью элементов button

Данный текст является ознакомительным фрагментом.