问显示的替代方案:无移动设备

EN

首先，很高兴看到，尽管您谈论的是display:none;，但实际上您仍然希望显示内容，而不是图像的花哨。干得好。

接下来我要考虑的是，如果你不想在手机上加载图片，那为什么还要在更大的网站上添加图片呢？如果图片不能提供功能，帮助更好地解释内容，那么为什么不把它也放在桌面大小上呢？

如果它确实有助于讲述一个故事，那么你可以包括图像和一些流行的图像服务，如adaptive images，hiSRC或PictureFill，这些服务将首先服务于移动版本的图像，并在更高的视口下替换为更大的图像(但请记住，没有带宽测试)。

最后，如果您确实想提供一些不同的内容，那么可以采纳fire的建议，使用ajax包含更多的内容。来自灯丝的South Street toolbox组可以帮助你，特别要注意AjaxInclude模式(它也有一个指向图片填充的链接)。

您可以考虑存储JSON编码的大量数据，然后创建元素并按需加载它们，如下所示

var heavyImage = new Image();
heavyImage.src=imageList[id];

然后，您可以将图像元素附加到所需的块。从我使用手机的经验来看，这比通过AJAX请求<img>更健壮，因为AJAX有时会相当慢。

你也可以用这种方法‘预取’图像(像2-3个相邻的可见图像)，从而改善用户体验。

您可以通过AJAX引入较重的元素，这样它们一开始就不会停留在页面上，从而使页面加载更快。只有当屏幕尺寸大于X时，才能决定执行AJAX调用。