node.js スタックの上に Paper.js を使用して構築された単純なチューナーを作成しようとしています。
チューナーはデスクトップ ブラウザーでは問題なく動作しますが、iPhone または iPad で 6 つの四角形 (または文字列) のいずれかをクリックすると、画面がちらつきます: http://morning-temple-9106.herokuapp.com/
iPhone での一般的な html のちらつきに関連するこれらの CSS 修正を試みましたが、うまくいきませんでした。
canvas {
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0,0,0);
}
オーディオをロードする JS は次のとおりです。再生を高速化するために、playNote が呼び出される前にファイルをロードします。playNote内でロードしてもちらつきが発生します。
var audioPlayerE = new Audio();
audioPlayerE.src="strings/E.mp3"
audioPlayerE.load();
var audioPlayerA = new Audio();
audioPlayerA.src="strings/A.mp3"
audioPlayerA.load();
var audioPlayerD = new Audio();
audioPlayerD.src="strings/D.mp3";
audioPlayerD.load();
var audioPlayerG = new Audio();
audioPlayerG.src="strings/G.mp3";
audioPlayerG.load();
var audioPlayerB = new Audio();
audioPlayerB.src="strings/B.mp3";
audioPlayerB.load();
var audioPlayerElittle = new Audio();
audioPlayerElittle.src="strings/Elittle.mp3";
audioPlayerElittle.load();
playNote = function(index,count) {
var noteStr;
if(index-count==0) {audioPlayerE.play()}
if(index-count==1) {audioPlayerA.play()}
if(index-count==2) {audioPlayerD.play()}
if(index-count==3) {audioPlayerG.play()}
if(index-count==4) {audioPlayerB.play()}
if(index-count==5) {audioPlayerElittle.play()}
}
ここに私の github リポジトリがあります: https://github.com/dannycochran/cs184