【发布时间】：2011-10-11 09:17:46
【问题描述】：
我目前正在构建网站的移动版本。
不是一个单独的域 (mobile.example.com)，而是一种响应式方法（使用媒体查询加载某些 CSS 以适应屏幕大小）
但是，我似乎不知道如何减小“页面大小”。
我的网站的桌面版本包括一个 jquery 滑块插件，它可以在五个相对较大的高分辨率图像中滑动。我的移动端不包括那个。但是，这些图像会在构建移动版本时继续加载。
我已将它们的显示属性设置为无，但这仍会加载图像。
那么，无论是通过 javascript 还是其他类型的媒体查询，我如何才能指定应该加载和不应该加载哪些文件？
【问题讨论】：
-
如果您的页面是动态生成的，您可以根据用户代理字符串进行操作。不过，这不是最好的方法。
-
不，这就是我使用媒体查询的原因——基本上如果屏幕分辨率小于 480，我会加载某个样式表。我只是不知道如何不加载页面上的其他图像。
-
我能想到的唯一方法是仅通过 JavaScript 提供图像标签和/或 src 路径，具体取决于媒体设备。当然，这给没有 JS 的用户带来了一系列全新的问题。我认为提供两组不同的页面可能是您唯一的希望。
标签： iphone css mobile media-queries responsive-design