Question

我有一个问题，哪一个在webBrowsers中表现最好？使用给定的url图像绘制画布＆＃34; context.drawImage（...）＆＃34;或者只使用css和＆＃34;背景：网址（＆＃39; ...＆＃39;）＆＃34;。（两个图像都将整个网页填充为壁纸）

对于填满整个页面的大图片（壁纸），我认为用css加载图像更重。至少对于firefox（20+），如果您更改标签或最小化窗口并再次返回到您的页面（带背景），我可以看到图像在半秒后再次显示。

所以，我问bc我发现很多人都说基本的DOM更好。

css代码：

--html: <body></body>

$('body').css('background', 
"url('http://www.iwallscreen.com/stock/city-lights-hd-wallpaper.jpg') repeat fixed 0 0 #000000");
$('body').css('background-size', "100% auto");

画布代码：

--html: <canvas id="canvasWall" style="position:fixed;left:0;z-index:-1;"></canvas>

var context = $('#canvasWall')[0].getContext("2d");
context.canvas.width  = window.innerWidth;
context.canvas.height = window.innerHeight;
var img = new Image();
img.src = 'http://www.iwallscreen.com/stock/city-lights-hd-wallpaper.jpg';   
img.onload = function() {
    context.drawImage(img, 0, 0, window.innerWidth, window.innerHeight);
};

HTML5 canvas drawImage或CSS background url

0 个答案: