<DOCTYPE html>
<html>
<head>
<meta charset=utf-8/>
<title>绘图示列</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
var canvas = $('#myCanvas');
canvas.attr("width",$(window).get(0).innerWidth)
canvas.attr("height",$(window).get(0).innerHeight)
var context = canvas.get(0).getContext("2d");
context.fillRect(0,0,canvas.width(),canvas.height());
$(window).resize(function(){
canvas.attr("width",$(window).get(0).innerWidth)
canvas.attr("height",$(window).get(0).innerHeight)
context.fillRect(0,0,canvas.width(),canvas.height());
});
});
</script>
<style type="text/css">
*{margin:0;padding:0;}
html,body{height:100%;width:100%}
canvas{display:block;}
</style>
</head>
<body>
<canvas id="myCanvas">
您的浏览器版本目前不支持HTML5
</canvas>
</body>
</html>
html5绘图铺满整个屏幕
最新推荐文章于 2024-06-13 10:43:51 发布