Smart Phone Game ページを追加。
というか「ひよこを倒す」の糞みたいなコードを ES6 で書き換えた。
iPhone と Google Chrome の開発者モードでしか確認していない、多分大丈夫。
んでドハマリしたこと。
canvas のサイズは style で指定してはいけない。
こんなページをみつけてやっと解決した。
HTML canvas 基礎0 – socialakiba wiki
1 2 3 4 5 6 7 8 9 10 11 | var ES6Game = class { constructor() { // etc... doBlockBreaking() { this .canvas = document.createElement( "canvas" ); // Do not use. //this.canvas.style.width = `${document.documentElement.clientWidth}px`; //this.canvas.style.height = `${window.innerHeight}px`; // OK! this .canvas.width = document.documentElement.clientWidth; this .canvas.height = window.innerHeight; |
と。
style 指定だと moveTo 等がワケワカな位置になってしまう。
それ以外は何も難しいことはなかった。
とにかく古臭いコードの一掃だ!