1. 程式人生 > >Html5—Canvas之如何自適應屏幕大小

Html5—Canvas之如何自適應屏幕大小

ace element body tee create before child 外部 屏幕

只有內嵌css有效,外部css會出現拉伸的情況,
所以有兩種方案

var myCanvas = "<canvas id=‘myCanvas‘ width=‘" + screen.availWidth + "px‘ height=‘"+ screen.availHeight + "px‘></vanvas>";
document.body.insertAdjacentHTML("beforeEnd", myCanvas);
或者這種做法
var myCanvas = document.createElement("canvas");
myCanvas.setAttribute("width", screen.availWidth);
myCanvas.setAttribute("height", screen.availHeight);
myCanvas.setAttribute("id", "myCanvas");
document.body.appendChild(myCanvas);
兩種方案的共性都是在把元素添加進DOM前設置他的大小

Html5—Canvas之如何自適應屏幕大小