无缝地使用网页上的大的背景图片

Question

我想在我的网站，但没有给用户很难下载他们的网站寻找丑陋的背景负载有巨大的背景图像。

他们不会比1920年在尺寸X 1080更大，但是它很难以千字节/兆字节为单位的话。

什么是我选择这里的，哪些是最有效的？

我不是太打扰约带宽，只希望用户觉得一切都看起来不错;）的

Answer 1

一种选择是使用多个背景。具有小的背景为底层，并用较大的背景覆盖。

这可能是棘手的有两个背景，如果你想在它身上的和的要支持IE浏览器。解决方案可能是启动小体背景使用JS到低分辨率背景改变为高清晰度一旦加载：

var i = new Image();
i.onload = function(){document.body.style.backgroundImage = 'url(' + i.src + ')';}
i.src = 'gigantic.jpg';

---

记

请，这种大的背景需要更多的RAM比一些移动浏览器具有（iPhone的预3GS要么拒绝这样的图像在所有解码或将开始吹扫在恐慌缓存/选项卡的内容）。

后一个问题可围绕与CSS媒体查询被加工：

http://lofotenmoose.info/css/destroy/media-查询背景拉伸/

除了查询max-device-width代替（虚拟/缩放）max-width。