0

帆布に雪を降らせてみました。コードはChromeでは問題なく動作しますが、FF18では何も表示されません。

http://dharman.eu/flakes/

コンソールでチェックすると、Firebugは次のエラーをスローします:
無効または不正な文字列が指定されました
var s = flakes[flake].chara;
ctx.fillText(s,flakes[flake].x, flakes[flake].y);

私のコードの何が問題になっていますか?

また、100%と指定されているのに、canvas要素の幅が大きすぎるようです。なんで?

var screenH = window.innerHeight;
var screenW = window.innerWidth;
canvas.width = screenW;
canvas.height = screenH;
4

2 に答える 2

1

init();コードの一番下に移動すると、機能します。

//...

$('#canvas').dblclick(function () {
    RunPrefixMethod(canvas, "RequestFullScreen");
});

//width/height 100%
var screenH = window.innerHeight;
var screenW = window.innerWidth;
canvas.width = screenW;
canvas.height = screenH;

init();  //<--here

screenH定義されていないため。(変...)

デモ: http: //jsfiddle.net/DerekL/jNf47/


ボーナス:デバッグ

まず、の変数の1つがctx.fillText定義されていないことを知っているので、どれが定義されているかを確認する必要があります。

console.log(s,flakes[flake].x, flakes[flake].y);
//[some number], [some number], undefined)

したがって、問題はにありflakes[flake].yます。flakes[flake].yを参照しているようですscreenHので、それscreenHが問題です。通常、変数は呼び出す前に定義する必要がinit()あるため、変数を一番下に移動するだけで機能します。

于 2013-02-09T22:08:04.327 に答える
0

問題はコードの順序です。

これらの変数を設定する前に、アニメーションの実行を開始するinit()を呼び出します

var screenH = window.innerHeight;
var screenW = window.innerWidth;

次に、drawFlakesループで、フレークのy値をscreenH(未定義)に割り当てようとします。

else
{   
  flakes[flake].y=screenH;
  flakes[flake].die-=33;
}

そして最後にフレークをレンダリングすることになると

ctx.fillText(s,flakes[flake].x, flakes[flake].y);

yは未定義であり、エラーが発生します。

于 2013-02-09T22:13:49.890 に答える