canvasフルスクリーンの問題について
1697 ワード
ちょうどcanvasを手に入れて、その全画面の問題に、卵の痛みを手に入れて、最後に解決して、とても興奮しています.
canvasフルスクリーンについては、実際には2つのことを知っています.1.canvas等比スケーリング2.canvasストレッチ
1等比スケーリング方法1:
以上の方法で幅の高さを設定すると300*150の割合で縮小して拡大します.
2延伸幅を次のように設定すると、Canvas要素は元の大きさから設定した幅に延伸されます.方法1:CSSを使用すると引き伸ばされる
方法2:HTML 5スタイル操作で引き伸ばされる
方法3:jqueryの
その他:canvasのwidthとheightもパーセンテージで表すことはできません.canvasはパーセンテージ値を数値として表示します.
私が使っているのは中を伸ばす方法2で解決した問題です.どうもありがとうhttp://www.myexception.cn/HTML-CSS/631965.htmlの資料
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の資料