html - 使用 Supersized 跨不同分辨率调整背景图像大小/加载

Question

所以我使用 Supersized 来缩放我的背景图像，这一切都很好。问题是，如果我想让图像在多种分辨率下看起来都不错，它应该很大，例如2000 像素 * 2000 像素。但是，为什么有决议的人应该。 800*600这么大的图片需要下载吗？所以我想做的是，假设有 3 种尺寸的图像(1024 * n、1680 * n 和 2000 * n)，并且根据分辨率，将其中最小的尺寸发送到用户。关于我应该如何实现它有什么想法吗？

Answer 1

使用 Javascript 的 window.screen.width 将返回屏幕的实际像素宽度，因此您可以使用简单的 if 语句来选择要使用的图像。

if(window.screen.width < 1000) {
    image = "small.jpg";
} else {
    image = "large.jpg";
}