标签：body roman meta 支持 head load sla color pad
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
margin:0;
padding:0;
}
html,body{
height: 100%;
overflow: hidden;
background-color: white;
}
#test{
background-color: #616161;
position: absolute;
left:50%;
top:50%;
transform: translate3d(-50%,-50%,0);
margin:auto;
}
</style>
</head>
<body>
<canvas id="test">
<span>您的浏览器不支持canvas</span>
</canvas>
</body>
</html>
<script>
var canvas=document.querySelector(‘#test‘);
//将整个视口设置为飞鸟运动的框口
canvas.width=document.documentElement.clientWidth;
canvas.height=document.documentElement.clientHeight;
if(canvas.getContext){
var ctx=canvas.getContext(‘2d‘);
var flag=0;
var value=0;
// 定时器：动态的获取飞鸟图片
setInterval(function () {
ctx.clearRect(0,0,canvas.width,canvas.height);
value+=10;
flag++;
if(flag===9){
flag=1;
}
var img=new Image();
img.src="img/1"+(flag)+".jpg";
img.onload=function () {
draw();
}
},1000/60);
function draw(img) {
ctx.drawImage(img,value,0,)
}
}
</script>
标签：body roman meta 支持 head load sla color pad
原文地址：https://www.cnblogs.com/huaweimian/p/13525754.html
