问题标签 [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.
css - 高分辨率移动 1080px（Xperia Z 等）的媒体查询
我试图掌握不同设备的媒体查询。由于高分辨率，我已经尝试过我的新索尼 Xperia Z 手机并以全尺寸站点格式显示。如何添加媒体查询以重新调整网格大小和格式，如标准手机比例？在 Xperia 上，字体也太小而无法阅读，需要显示得更大。对于像全尺寸显示器一样的视网膜设备来说，这是一个问题吗？
Xperia Z - 分辨率 1920 × 1080，PPI 443
如何包含此类设备的媒体查询？
image - 在 Retina 设备上放大图像
我知道图像在视网膜设备上默认放大，但默认缩放会使图像模糊。
我想知道是否有一种方法可以在最近邻模式下缩放它，其中没有创建透明像素，而是每个像素乘以 4，所以它看起来像在非视网膜设备上。
我正在谈论的示例可以在下图中看到。 示例 http://cclloyd.com/downloads/sdfsdf.png
screen - 视网膜 4 英寸 iPhone 5 不需要顶部/底部
我正在测试和实现 SDK Corona，因为在 xCode 模拟器中测试是屏幕顶部和底部的两个区域，在模拟器 iPhone5 中缺少皇冠。我正在使用许多网站中推荐的“config.lua”（代码如下），但我无法解决问题。
我希望我的应用适合整个屏幕。
http://www.coronalabs.com/blog/2012/12/04/the-ultimate-config-lua-file/
php - 如何使用 PHP 从 JPEG 创建视网膜图像
几个月前，我编写了以下脚本来转换上传的图像PHP to Retina和non视网膜图像。使用此脚本的 iphone 应用程序仅使用 PNG 图像，因此我编写了脚本以使用 PNG。
现在我需要相同的脚本，然后用于 Jpeg 图像。因为 iphone 应用程序会加载分辨率更高的图像，所以我们选择了 Jpeg。但我不知道如何使这项工作。
到目前为止我已经尝试过：
- 替换
imagecreatefrompng为 jpeg 版本 - 替换
imagepng为 jpeg 版本
有没有人有一个有效的例子或有用的链接可以让我走向正确的方向？
iphone - iPhone 图像纵向和横向模式 HTML5
嗨，我一直在网上搜索，但无法真正找到明确的答案。
我目前正在转换要在 iphone 上使用的 html5 网站。
我的查询是关于图像的，纵向模式是 320x960 像素，横向是 960x320 像素
对于视网膜显示，而不是将我的图像设置为 320x *（高度成比例），我将它们设置为 png 的 640 x *
我将图像宽度设置为 100% 并将视口大小设置为 320px
这对视网膜显示是否正确？
当设备方向发生变化时，当现有图像在横向模式下为 100% 时，我会失去质量，我的客户希望能够使用捏缩放来放大。
那么我需要有 1 张肖像模式的图像，我的横向模式图像，然后用 jquery 交换源 url 吗？
所有图像都存储在数据库中，但我可以操纵它们来自哪个文件夹，因此一组图像将位于横向文件夹中，另一组位于纵向文件夹中。
我认为这是有道理的，有人可以让我正确解决图像分辨率谢谢
variables - 如果满足媒体查询条件，则更改 LESS 变量
如果在我的样式表中满足某些媒体查询条件，我希望更改一些 LESS 变量（用于维护高分辨率图像路径），但我似乎无法让它工作。
也许有一个更简单的解决方案？
iphone - 视网膜图像在 Xcode 中爆炸了 4 次
目前，我正在为 iPhone 和 iPad 的朋友开发流媒体广播应用程序。
在将我的设计实现到代码中时，我遇到了一个有趣的错误（？）。我希望使用此示例教程在背景上显示专辑封面并对其进行遮罩。
它在低分辨率 iPhone 上运行良好，但一旦我在 iPhone 4 和 5（测试设备和模拟器）上测试它，图片就会显示为应有的 4 倍。
它应该显示如下：
我已经添加了普通图片和@2x，它们的分辨率分别为 320x320 和 640x640 (@2x) 我应该添加的最后一件事是，如果我不屏蔽图像，它可以正常工作。但我相信面具是有效的（如果它不会被炸掉 4 倍的话）。因此，代码可能会将图片放大两次，而不是一次。
添加一些我的代码：
image - 适用于 WordPress 的自适应图像+：与 WordPress 集成
介绍
我决定为创建自适应图像的脚本创建一个主题。我已经更新了这个主题，所以我可以参考。要求更专注于特定答案@ChrisFerdinandi 建议我使用脚本Adaptive Images+。该脚本将完全按照我的要求进行。
所以我一直在寻找一个脚本，当在视网膜屏幕上访问网站时检查我，比如用于 WordPress 的 iPad 或 iPhone。
问题
我将在每一步解释我做了什么并分享我的代码。在我分享我的代码和演练所有步骤之前，我将发布一些关于我的 WordPress 安装的信息。
我已经将我的 WordPress 安装安装在一个名为/wordpress. 我正在使用我自己开发的自定义 WP 主题。我将特色图片用于我的投资组合项目。我在我的function.php文件中创建它们add_image_size('thumbnail-portfolio', 300, 200, true);
根据 Chris Ferdinandi 的插件安装页面，我们首先更改步骤 1.htaccess中的文件。所以，我所做的就是在评论之间和之后的所有内容。#START Adaptive-Images#END Adaptive-ImagesRewriteEngine On
所以我的整个文件是这样的：
好的，修改.htaccess文件后，我上传到服务器。我在子文件夹中更新它/wordpress。好了，我们进入第 2 步。这一步我跳过了，因为这是一个可选选项。
正确的步骤 3。我上传adaptive-images.php到与我的文件相同的目录中.htaccess，为清楚起见，我将两个文件都上传到了子目录中。/wordpress.
第 4 步<head>：在所有其他脚本运行之前，我在开始之后添加 cookie 脚本。我的整个文件如下所示：
好的，这也完成了。在第 5 步中。我已将代码片段添加到我的 css 文件中。
好的，最后一步。第 6 步是测试所有的东西，这里可能问题马上就清楚了。由于我可以访问移动设备视网膜，我决定首先在该设备上查看我的网站。可惜只显示小分辨率图片，使图像焦点不清晰。然后我看着第 6 步表明是否真的有新图像被创建和存储/保存。ai-cache脚本创建了一个文件夹adaptive-images.php，但不幸的是这是空的。
需要注意的是，我已将特色图像尺寸设置为正常尺寸，而不是视网膜版本。对于默认视图也是如此300x200，因为视网膜将是大小600x400px
我做了什么？
我已经检查了脚本的调试页面。我注意到 cookie 将设置为resolution. 当我替换所有图像RewriteRule .(?:jpe?g|gif|png)$ adaptive-images.php中的行时，该.htaccess行将RewriteRule .(?:jpe?g|gif|png)$ test.png被该图像覆盖。
删除错误调用之前的注释后将给出错误。每条路径都链接正确。
我试图将文件夹的权限ai-cache从755更改777为没有结果。
uibutton - 视网膜显示的按钮图像未正确显示
我有一个按钮图像，如果从界面生成器调用它会正确设置。但是当从代码图像设置时，视网膜显示无法正确显示。我是否必须在代码中明确指定 2x 图像。
image - Cocos2d 不会自动检测@2x 视网膜精灵图像
每当我使用
Cocos2d 一直很聪明，可以在非 Retina 设备上查找“image.png”，在 Retina 设备上查找“image@2x.png”。
但是每当我尝试动态构建精灵文件名字符串时，即
突然之间，我的@2x 文件被完全忽略了——而 cocos2d 只寻找 === "greenSquare.png" 即 "greenSquare@2x.png" 从未被拾取的文件，如果 "greenSquare.png" " 不存在（我当时只测试视网膜显示器）整个应用程序崩溃。
知道为什么会发生这种情况以及我能做些什么来解决这个问题吗？
（理想情况下，不必手动检查设备视网膜状态，然后手动附加@2x - 因为我知道这是一个可能的解决方案，它看起来不像是正确的）。
谢谢！