HTML5 知识库

使用HTML5 的打鼓机器

   阅读:383次   评论:1条   更新时间:2011-09-15    

Brian Arnold使用HTML5<audio>创建了一个有趣的打鼓机器 - HTML5 Drum Kit,我们之前也介绍过一个不使用Flash的打鼓机器:JS-909。 

function playBeat() {
        if (isPlaying) {
                var nextBeat = 60000 / curTempo / 4;
                // Turn off all lights on the tracker's row
               $("#tracker li.pip").removeClass("active");
                // Stop all audio
                stopAllAudio();
                // Light up the tracker on the current pip
                $("#tracker li.pip.col_" + curBeat).addClass("active");
                // Find each active beat, play it
                $(".soundrow[id^=control] li.pip.active.col_" + curBeat).each(function(i){
                        document.getElementById($(this).data('sound_id')).play();
                });
                // Move the pip forward
                curBeat = (curBeat + 1) % 16;
                // Schedule the next one
                setTimeout(playBeat, nextBeat);
        }
}


Brian Arnold还创造了:ToneMatrix(或者是Tenori-on),使用纯HTML/JS。但是它们目前还不够完善,声音不够悦耳,如果你认真点还能得到些像样的声音,否则,它可能会伤害你的耳朵。

 

评论 共 1 条 请登录后发表评论
1 楼 wjing63 2009-07-09 10:01
感受了一下,酷毙了。

发表评论

您还没有登录,请您登录后再发表评论

Global site tag (gtag.js) - Google Analytics