 |
|
| |
| HTML5 Audio 2채널 재생 + 재생완료 리스너 |
|
|
  |
8년 전
|
•HTML5 Audio 2채널 재생의 개선판
•각 채널의 재성완료 시점 및 전체 채널의 재생완료 시점을 검출 가능
<script>
var last_ch = 1;
var chs = [];
chs[0] = new Audio();
chs[1] = new Audio();
chs[0].addEventListener('ended', function() { ch_ended(0); }, false );
chs[1].addEventListener('ended', function() { ch_ended(1); }, false );
function ch_ended(no) {
console.log("Ch #"+no+" ended.");
if(!chs[0].paused)return;
if(!chs[1].paused)return;
all_ch_ended();
}
function all_ch_ended() {
console.log("All chs ended.");
}
function sound_play(src) {
var current_ch = (last_ch == 1)? 0:1;
chs[current_ch].src = src;
chs[current_ch].play();
console.log('Playing on ch #'+current_ch+' (src='+src+')');
last_ch = current_ch;
}
</script>
<?php
$sounds = array(
array('label'=>'A major', 'src'=>'http://upload.wikimedia.org/wikipedia/commons/3/34/A-major.ogg'),
array('label'=>'B major', 'src'=>'http://upload.wikimedia.org/wikipedia/commons/f/fa/B-major.ogg'),
array('label'=>'C major', 'src'=>'http://upload.wikimedia.org/wikipedia/commons/3/32/C-major.ogg'),
array('label'=>'D major', 'src'=>'http://upload.wikimedia.org/wikipedia/commons/4/4b/D-major.ogg'),
array('label'=>'E major', 'src'=>'http://upload.wikimedia.org/wikipedia/commons/8/8c/E-major.ogg'),
array('label'=>'F major', 'src'=>'http://upload.wikimedia.org/wikipedia/commons/c/cf/F-major.ogg'),
array('label'=>'G major', 'src'=>'http://upload.wikimedia.org/wikipedia/commons/4/4e/G-major.ogg')
);
foreach($sounds as $sound) {
$label= $sound['label'];
$src = $sound['src'];
echo "<button onclick=\"sound_play('$src');\">$label</button>";
}
?>
예제)
<script>
var last_ch = 1;
var chs = [];
chs[0] = new Audio();
chs[1] = new Audio();
chs[0].addEventListener('ended', function() { ch_ended(0); }, false );
chs[1].addEventListener('ended', function() { ch_ended(1); }, false );
function ch_ended(no) {
console.log("Ch #"+no+" ended.");
if(!chs[0].paused)return;
if(!chs[1].paused)return;
all_ch_ended();
}
function all_ch_ended() {
console.log("All chs ended.");
}
function sound_play(src) {
var current_ch = (last_ch == 1)? 0:1;
chs[current_ch].src = src;
chs[current_ch].play();
console.log('Playing on ch #'+current_ch+' (src='+src+')');
last_ch = current_ch;
}
</script>
<button onclick="sound_play('http://upload.wikimedia.org/wikipedia/commons/3/34/A-major.ogg');">A major</button><button onclick="sound_play('http://upload.wikimedia.org/wikipedia/commons/f/fa/B-major.ogg');">B major</button><button onclick="sound_play('http://upload.wikimedia.org/wikipedia/commons/3/32/C-major.ogg');">C major</button><button onclick="sound_play('http://upload.wikimedia.org/wikipedia/commons/4/4b/D-major.ogg');">D major</button><button onclick="sound_play('http://upload.wikimedia.org/wikipedia/commons/8/8c/E-major.ogg');">E major</button><button onclick="sound_play('http://upload.wikimedia.org/wikipedia/commons/c/cf/F-major.ogg');">F major</button><button onclick="sound_play('http://upload.wikimedia.org/wikipedia/commons/4/4e/G-major.ogg');">G major</button> |
|
 추천 : 394 |
추천
목록
|
|
| |
|
