Questions tagged [retina]

Name used by Apple for their liquid crystal displays with a high pixel density.

239 questions
5
votes
1 answer

What do 'scale' and 'fontScale' values stand for in Dimensions object?

Dimensions.get() returns an object like Object { "screen": Object { "fontScale": 1, "height": 375, "scale": 2, "width": 667, }, "window": Object { "fontScale": 1, "height": 375, "scale": 2, "width": 667, …
5
votes
2 answers

Retina - Correlation between device pixel ratio and size of image?

I don't quite understand what the window.devicePixelRatio value is, and how it dictates what size image (2x, 3x, etc) I need for that device. For instance, on an iMac 5K Retina (Late 2015), I'd expect the pixel ratio to be at least 3 or so, but it's…
ffxsam
  • 26,428
  • 32
  • 94
  • 144
5
votes
2 answers

Chrome extension screenshot partial image cropping for Retina Display

I made a chrome extension, which captures a single element (div) of a website. I used chrome.tabs > captureVisibleTab to make a screenshot. Then, with the coordinates (x/y) and sizes (width/height) of the element (div) I crop the screenshot. This…
Danzzz
  • 523
  • 8
  • 26
5
votes
1 answer

MKTileOverlay with Retina-Tiles

I have issues to load 512x512px tiles in MKMapKit. The Server provides 512x512 .jpeg tiles. I could not find any solution or sample implementation for custom retina tiles in MKMapView. What I do: When I load them into MKMapView with overlay =…
user707342
  • 339
  • 1
  • 2
  • 9
5
votes
2 answers

Why do low resolution images appear blurry on websites viewed with retina screens?

When I have an image of 500 x 500 pixels the image looks sharp on a normal display (i.e. CSS pixels 1:1 map to device pixels). But when this image is viewed with a Retina display, it has to map every pixel of the image to 4 retina pixels (the…
Youri Thielen
  • 440
  • 4
  • 10
5
votes
1 answer

CSS3 keyframe animations sluggish on Retina display

Take a very basic CSS3 animation rule like this: .dimension.fadeIn { -webkit-animation: fadeIn 0.7s; -webkit-animation-timing-function:ease-in-out; height:24px; } @-webkit-keyframes fadeIn { 0% { height:0; opacity: 0; } 30% { …
subZero
  • 5,056
  • 6
  • 31
  • 51
5
votes
3 answers

Media query for high resolution mobile 1080px (Xperia Z etc)

I am trying to get to grips with media queries for different devices. I have tried my new Sony Xperia Z mobile and displays in full scale site format due to the high resolution. How do I add a media query to re-size a grid and format like a standard…
Daniel Kellaway
  • 189
  • 1
  • 5
  • 14
4
votes
1 answer

Is there a way to provide a fallback for missing srcset images?

I'm trying to implement retina (2x) images across my website. Our pages are built from templates where we just use standard inline images: I thought I could be clever and update this with srcset:
daGUY
  • 27,055
  • 29
  • 75
  • 119
4
votes
2 answers

Where is the HiDPI option in Linux mint 17 "mate"

I installed Linux mint 17 mate in my Macbook pro retina with Virtual box, but the font is very small, how do I enable the HiDPI option in mate?
Awin
  • 139
  • 2
  • 9
3
votes
1 answer

How to get the real screen size(screen resolution) by using js

I just wonder whether there exists a way to get screen real size(screen resolution) in js. I know the screen API, but its result not what I wanted. screen; // Screen {availWidth: 1680, availHeight: 973, width: 1680, height: 1050, colorDepth:…
xgqfrms
  • 10,077
  • 1
  • 69
  • 68
3
votes
0 answers

How to use data-uri with srcset in html?

Does data uri works with srcset attribute? Here how I use it but it does't change image source on 2x dpi display
Serhii Shliakhov
  • 2,631
  • 3
  • 19
  • 37
3
votes
6 answers

Xcode @2x image suffix not showing as Retina in iOS

I am having difficulties with retina images. The screenshot below shows the UICollectionView with a UIImageView contained within each UICollectionViewCell. Within the app I have a large image 512x512 pixels called travel.png. The green circle…
Charlie S
  • 4,366
  • 6
  • 59
  • 97
3
votes
1 answer

CSS Sprites RWD + Retina

I can't find any useful sugestions about my problem, so I decided to write a new topic. I'm trying to use a CSS Sprite feature and it work very well for small images, but if I want to "cut" bigger part of sprite - it's not responsive. I want to use…
Rst00
  • 93
  • 5
3
votes
1 answer

fix for blurry images on browsers used by a mac retina

I am making a game sorta like cookie clicker, and I want the images to look 8 bit. I use a macbook pro retina, which has four pixels for every one pixel on a normal screen. On Chrome and Safari, instead of each pixel being represented by 2x2 pixels,…
Mashpoe
  • 504
  • 1
  • 9
  • 27
3
votes
2 answers

Javascript Retina / HD display detection and blocking page render during reload

My question is pretty much about page reload rather than retina detection. I'm using the code below in head tag for retina display :