Examples
List of modules
-
Ace Editor
Affix
Alert
Audio
Button
Carousel
Char Counter
Color Picker
Data Table
Datepicker
Diagram Builder
Dropdown
Form Builder
Form Validator
I/O
Image Cropper
Image Viewer
Modal
Node
Pagination
Popover
Progress Bar
Rating
Scheduler
Scrollspy
Sortable Layout
Sortable List
Tabview
Timepicker
Toggler
Toolbar
Tooltip
TreeView
Video
Viewport
Audio
Play Pause Change Audio
<div id="myAudio"></div>
<br>
<a href="#" class="btn btn-success" id="play-btn">Play</a>
<a href="#" class="btn btn-danger" id="pause-btn">Pause</a>
<a href="#" class="btn btn-info" id="change-audio-btn">Change Audio</a>
YUI().use(
'aui-audio',
function(Y) {
var audio = new Y.Audio(
{
boundingBox: '#myAudio',
url: 'https://alloyui.com/audio/zelda.mp3',
oggUrl: 'https://alloyui.com/audio/zelda.ogg'
}
).render();
Y.one('#play-btn').on(
'click',
function(e) {
e.preventDefault();
audio.play();
}
);
Y.one('#pause-btn').on(
'click',
function(e) {
e.preventDefault();
audio.pause();
}
);
Y.one('#change-audio-btn').on(
'click',
function(e) {
e.preventDefault();
audio.pause();
audio.set('url', 'https://alloyui.com/audio/bc.mp3');
audio.set('oggUrl', 'https://alloyui.com/audio/bc.ogg');
audio.load();
audio.play();
}
);
}
);