[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
canvasを全画面表示するにはhtmlとcssだけではうまくいかないので、
#wrapperのサイズを取得してcanvasの幅と高さに指定します。
【html】
1 |
<body> |
2 |
<div id="wrapper"> |
3 |
<canvas id="main"></canvas> |
4 |
</div> |
5 |
</body> |
【css】
01 |
body{ |
02 |
margin: 0px; |
03 |
padding: 0px; |
04 |
position: relative; |
05 |
} |
06 |
07 |
body #wrapper{ |
08 |
width: 100%; |
09 |
height: 100%; |
10 |
position: fixed; |
11 |
} |
【js】
01 |
$(function () { |
02 |
sizing(); |
03 |
$(window).resize(function() { |
04 |
sizing(); |
05 |
}); |
06 |
}); |
07 |
08 |
function sizing(){ |
09 |
$("#main").attr({height:$("#wrapper").height()}); |
10 |
$("#main").attr({width:$("#wrapper").width()}); |
11 |
} |
