tiny sequencer

snarecowbellhatkick

clear

HTML5+javascriptでリズムマシン。Chrome推奨、というかChromeでしか完動しない。Firefoxではどうしてもリズムがもたれてしまうのと、Edgeではアニメーションがうまく動作しない。ライブラリ抜きで初心者特有の力技をつかって無理やり動作させている限界かもしれない。当初は全部SVGで描画して完結しようとしたものの、Chrome以外ではまったく動かず死亡。せめて音だけでも鳴るように、とシーケンサー部分だけcanvas要素を使って描画して、その他ブラウザ間でさほど動作にギャップのないボタンなどの要素は扱いが楽なSVGを使っている。Firefoxでうまく動作しないのは恐らく再生ポイントのリセットがうまくいっていないため、またEdgeでアニメーションがうまく動かないのはGIFアニメの再読込が妨害されているため(妨害ってなんか、悪いことみたいだけどブラウザのパフォーマンス的にはそのほうがよいにきまってる)。なんかうまい解決方法あったらいいのにな~と思いつつ、いまの力ではこれが限界やで、ということでアップ。Chromeでの姿が理想形なんや…

トップに戻る / Back to Top