242 件のレッスンと 618 件のレッスン動画が見つかりました。

#06 drawImageで画像を切り出そう PREMIUM

JavaScriptで15パズルを作ろう
drawImage()の引数に必要な情報を与えてパネルを切り出していきます。

#07 すべてのタイルを描画しよう PREMIUM

JavaScriptで15パズルを作ろう
タイルの状態をプロパティに保持しておいてそのとおりに描画する方法を見ていきます。

#08 クリックイベントを設定しよう PREMIUM

JavaScriptで15パズルを作ろう
canvasの左上を原点とした座標を求める方法を見ていきます。

#09 クリックした位置を求めよう PREMIUM

JavaScriptで15パズルを作ろう
クリックした座標の列と行を求める方法を見ていきましょう。

#10 上下左右のタイルを調べよう PREMIUM

JavaScriptで15パズルを作ろう
クリックしたタイルの上下左右を調べる方法について見ていきます。

#11 クリックしたタイルを入れ替えよう PREMIUM

JavaScriptで15パズルを作ろう
destCol、destRowを使ってタイルを入れ替えていきます。

#12 空白のタイルを動かしてみよう PREMIUM

JavaScriptで15パズルを作ろう
空白のタイルを入れ替えるために必要な移動先の列と行を求めていきます。

#13 タイルをシャッフルしてみよう PREMIUM

JavaScriptで15パズルを作ろう
destColとdestRowの範囲をチェックしたあとに、分割代入を使ってタイルを入れ替えていきます。

#14 switch文を書き換えてみよう PREMIUM

JavaScriptで15パズルを作ろう
上下左右の移動距離を配列にしてswitch文を書き換えていきます。

#15 移動距離の差分を配列にまとめよう PREMIUM

JavaScriptで15パズルを作ろう
UDLRを使ってdestColとdestRowを求めていきます。