问题标签 [retina]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
internet-explorer - 使用 LESS 动态生成 mixin
你如何动态地改变一个mixin。我想这样调用less文件：
然后我尝试像这样设置我的混音：
但是当我构建时我不断收到错误：“无法调用未定义的方法'切片'。”
知道如何调用像“facebook”这样的名称并同时运行 mixin 的视网膜和非视网膜版本吗？
css - 一张图像中的简单图像和视网膜图像
我有这个代码：
smi.png - 这是简单的图像
我有smi2.png - 这是视网膜图像
如何在此代码中设置两个图像？
html - Retina 图像没有在响应中调整大小
我有一个正在开发的网站，它使用retina.js ( http://imulus.github.io/retinajs/ ) 来为视网膜图像切换非视网膜图像，专门用于视网膜设备。该网站是一个响应式 HTML 网站（使用 Twitter Bootstrap）。这是问题所在：当页面在视网膜设备上加载时，图像会被切换，因为视网膜设备应该切换到 image@2x.jpg，到目前为止还不错。问题是一旦我调整浏览器窗口的大小（在加载视网膜图像之后）使浏览器的宽度变小，图像的宽度调整得很好，但高度保持不变，有效地垂直挤压图像，从而扭曲图像。更改方向时，iPad 和 iPhone 上也会发生同样的情况。
这是之前的图像：
这是我按浏览器宽度调整大小后的图像：
有没有人遇到过这个问题？
css - Retina Graphics 显示太大？
我制作了两张图片：一张用于正常显示（350px x 43px），另一张用于视网膜（700px x 86px）。使用下面的代码一切正常，因为它应该关于更改图像，但 hi-res.jpg 以他的实际尺寸 700px x 86px 显示？我对视网膜图形完全陌生，因此不知道解决此问题的正确方法。两个图像都应该在一个 350px 宽和 43px 高的 div 中！
我认为正在发生的事情是在视网膜显示器上每英寸有更多的像素，因此需要更大的图像。我制作了更大的图像，但如何将其包含在 div 中并使其正确显示？
HTML
非常感谢您的帮助。我一直在尝试各种 CSS 来解决这个问题！
jquery - 在非视网膜设备上将@2x 添加到高于特定分辨率的 src
我在我的网站上使用retinaJS 在视网膜设备上提供@2x 图像。
我还希望能够使用 jQuery 在非视网膜 - 大屏幕桌面设备上提供 @2x 图像。因此，如果屏幕分辨率高于 1330 像素，那么我希望能够在文件后缀/扩展名之前直接将 @2x 添加到文件名的末尾。
有人可以建议我怎么做吗？
我的理论是找到目标 DIV 中的所有图像（例如 .bodycontent），然后从属性 src 倒数 4 个字符并将@2x 添加到 src
例如
example.jpg 变成 example@2c.jpg 和 chickens.png 变成 chickens@2x.png
这当然只适用于具有 3 个字母扩展名的文件 - 例如 png / jpg - 但没关系，因为我从不将文件称为 JPEG ......
我需要将代码应用于目标 DIV 中找到的所有图像。
有什么帮助吗？
干杯
每次调整大小时都会调用此函数以检查是否需要应用 @2x - 我如何添加一些代码来检查 @2x 是否已包含在 attr src 中，然后如果它已经是 @2x 则不执行此操作？
html - 如何制作可在视网膜和非视网膜设备上使用的视网膜就绪图像
这是对以下链接的跟进
这是澄清，因为这么多词对不同的人意味着不同的东西。似乎有一张在视网膜和非视网膜设备上看起来都不错的图像：
如果屏幕上的图像的最大宽度为 400，最大高度为 300，则图像本身应为 800 x 600，ppi 为 144。那么文件应该被高度压缩以最小化其下载时间。
当您显示图像时，您可以使用 css/html 代码将其强制为最大宽度和最大高度，如下所示：
这个对吗？（我已经决定我们公司不会使用 responsive.js 或 cdn。）
unity3d - 视网膜 iPad 上的两种纹理比例不同
我的代码有问题：
它应该看起来完全一样，并且在编辑器中也是如此。它在 iPad2 上看起来也完全一样，但在 iPad3 上，顶部的 GUI.Button 缩小到大约 90%。
任何想法可能是什么问题？
我举了一个简单的例子来说明这个问题。这是它在 iPad2 上的外观和外观。
这是它在视网膜屏幕上的外观：
红色部分是按钮，它首先覆盖整个背景，但第二个只有 90%。
css - SVG 图像精灵在 IE9 和 10 中不起作用
这不仅是 IE 9 和 10 中的问题，也是 Safari 的旧版本（如 5.1.7）
我想使用 SVG 图像精灵，它在所有最新版本的 Chrome、Firefox 和 IE 上看起来都很好，但在 IE 9 和 10 上，它使图像看起来被压扁并且没有以正确的大小显示。
请在 IE 9、IE 10 或 Safari 5.1.7 中查看此 JS 小提琴：http: //jsfiddle.net/NGSM3/3/以查看问题。我想继续为此使用图像精灵，但想将它们更新为 SVG 图像精灵。
我的 HTML：
我的 CSS：
javascript - 制作游戏画布高分辨率（视网膜）
目标是制作高分辨率/视网膜的游戏画布。
我正在使用一个名为 Gamemaker 的软件，我想制作这个画布高分辨率/视网膜。虽然我不知道如何植入这个。
这里有两个链接非常清楚地解释了这个问题 http://www.smashingmagazine.com/2012/08/20/towards-retina-web/ 和 http://www.html5rocks.com/en/tutorials/canvas/hidpi /
这是 html5 页面用来启动游戏的代码：
游戏的 javascript 文件无法读取。
我如何实现制作整个 javascript 画布高分辨率/视网膜？
javascript - 我可以通过使用媒体查询设置内容 css 属性来测试视网膜设备吗？
是否有人认为在视网膜设备content上设置 css 属性以body运行特定于视网膜的 js 有什么问题？
在我看来，这似乎是用于测试视网膜设备的最简单、最轻便的跨浏览器解决方案。至少它对我有用......
CSS：
用 jQuery 测试：