7

谁能想到我可以发现用户每英寸像素的方法？我想确保图像在网络浏览器中显示的大小与我需要的大小完全一致，因此结合使用分辨率（我可以从用户代理获得）和每英寸像素我可以做到这一点。

但是，我不确定是否有任何方法可以发现用户每英寸的像素，最好是使用 JavaScript 或其他一些非侵入性方法。

有什么建议么？

谢谢，

CJ

4

5 回答 5

6

您可以使用以下 javascript 函数来获取 DPI。

<script type="text/javascript">
   var dpi = {
      v: 0,
      get: function (noCache) {
         if (noCache || dpi.v == 0) {
            e = document.body.appendChild(document.createElement('DIV'));
            e.style.width = '1in';
            e.style.padding = '0';
            dpi.v = e.offsetWidth;
            e.parentNode.removeChild(e);
         }
         return dpi.v;
      }
   }

    alert(dpi.get(true));  // recalculate
    alert(dpi.get(false)); // use cached value
</script>

但是，我认为它总是会96在 Windows 机器上返回。

据我所知，操作系统无法确定视口的实际物理尺寸。因此，很可能软件实际上不可能知道真实的 DPI。

然而，专业人士是某些部门确保屏幕上的 DPI 与现实生活中的 DPI 匹配。在这种情况下，上面的 javascript 可能就足够了。

注意：
以上代码在 Opera 9、IE6 & 7 和 Firefox 3.6 在 WinXP 和 Win2k 上测试。

更新：
添加了 noCache 参数。但我怀疑它会产生任何影响。我在上述 Windows 版本上使用 FireFox 和 Opera 进行了缩放测试，无论缩放量如何，它们都将 DPI 引用为“96”。看看移动设备是如何做到这一点的会很有趣。

于 2010-02-22T17:07:45.270 回答
5

你可以像以前的绘图包那样做，并显示一个可伸缩的尺子。让您的用户拖动虚拟标尺，直到它与他们放在屏幕上的物理标尺匹配。

对生产使用不是一个严肃的建议，但可能是真正获得正确答案的唯一方法:(。

于 2010-02-17T16:25:39.627 回答
1

最安全和最简单的方法是告诉浏览器您想要什么尺寸的图像。CSS 支持英寸和公制，因此您可以像以下任何示例一样指定图像：

<img src="image.png" style="width:15cm;height:10cm;" alt="Centimeters" />
<img src="image.png" style="width:5.9in;height:3.9in;" alt="Inches" />
<img src="image.png" style="width:150mm;height:100mm;" alt="Millimeters" />
于 2010-02-23T09:55:55.543 回答
0

今天的显示器支持 96px/inch 或 72pixels/inch。

可以获取 HTTP 请求的 User-Agent 标头

User-Agent: Mozilla/5.0 (Linux; X11)

这个会告诉你操作系统，你可以从这里做出决定。

于 2010-02-12T13:28:26.577 回答
0

这可能非常困难 - 即使您设法基于 dpi 缩放渲染的图像，您如何防止用户直接在浏览器中缩放图像？

您是否考虑过一些丰富的接口技术，例如 flash 或 Silverlight？他们可能会给你额外的选择。

于 2010-02-17T16:11:51.027 回答