canvasフルスクリーンの問題について

1697 ワード

ちょうどcanvasを手に入れて、その全画面の問題に、卵の痛みを手に入れて、最後に解決して、とても興奮しています.
canvasフルスクリーンについては、実際には2つのことを知っています.1.canvas等比スケーリング2.canvasストレッチ
1等比スケーリング方法1:方法2:HTML 5 Canvas APIを使用した操作
var canvas = document.getElementById('canvas id');
canvas.width = 500;
canvas.height= 500;

以上の方法で幅の高さを設定すると300*150の割合で縮小して拡大します.
2延伸幅を次のように設定すると、Canvas要素は元の大きさから設定した幅に延伸されます.方法1:CSSを使用すると引き伸ばされる
 #canvas id{
     width:1000px;
     height:1000px;

方法2:HTML 5スタイル操作で引き伸ばされる
var canvas = document.getElementById('canvas id');
canvas.style.width = window.innerWidth + "px";
canvas.style.height = window.innerHeight + "px";

方法3:jqueryの$("#id").width(500)で引っ張られる
その他:canvasのwidthとheightもパーセンテージで表すことはできません.canvasはパーセンテージ値を数値として表示します.
私が使っているのは中を伸ばす方法2で解決した問題です.どうもありがとうhttp://www.myexception.cn/HTML-CSS/631965.htmlの資料