"Click the buttons to play or pause the audio"
Bootstrap 3.1.0 Snippet by muhittinbudak

Post to Facebook Tweet this

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Strait">
<div class="container" style="font-family: 'Strait', sans-serif;">
<div class="row">
<h2>Play sound mp3 audio</h2>
<audio id="myAudio">
<source src="https://www.w3schools.com/html/horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<button id="playBtn" class="btn btn-primary btn-lg" style="margin-right:10px" ><span class="glyphicon glyphicon-play"></span> Oynat</button>
<button id="pauseBtn" class="btn btn-danger btn-lg " ><span class="glyphicon glyphicon-pause"></span> Durdur</button>
</div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
$(document).ready(function(){
var audio = $('#myAudio')[0];
$('#playBtn').click(function(){
audio.play();
});
$('#pauseBtn').click(function(){
audio.pause();
});
// https://cdn.freesound.org/previews/548/548096_12302765-lq.mp3
// https://cdn.freesound.org/previews/455/455198_6142149-lq.mp3
// https://www.w3schools.com/html/horse.mp3
});
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

Related: See More

Paper Bootstrap Wizard
Ribbon Buttons
Сonvenient buttons

Questions / Comments: