https://github.com/jayphelps/web-retina-emulator

A tiny script for testing what your website looks like on a 2x pixel density (retina) display.
https://github.com/jayphelps/web-retina-emulator

Last synced: 21 days ago
JSON representation

A tiny script for testing what your website looks like on a 2x pixel density (retina) display.

• Host: GitHub
• URL: https://github.com/jayphelps/web-retina-emulator
• Owner: jayphelps
• Created: 2012-06-21T01:22:32.000Z (over 12 years ago)
• Default Branch: master
• Last Pushed: 2014-01-14T18:58:56.000Z (almost 11 years ago)
• Last Synced: 2023-03-22T22:37:19.581Z (over 1 year ago)
• Language: JavaScript
• Size: 114 KB
• Stars: 30
• Watchers: 6
• Forks: 15
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
WRE (Web Retina Emulator)

=========================

**Note: Chrome 32 now supports changing the Device Pixel Ratio via the new Emulation->Screen section. Unlike this script, using that new feature of Chrome will actually let you test everything pixel ratio related, including media queries. So yeah, use that instead of this.**

For anyone who has a normal 72/96 dpi display but wants to get a "glance" at how their HTML is rendering for retina displays. It will basically just make your page twice as big, allowing you to quickly see what images are not retina-ready and also point out any CSS properties that may cause blurriness. (like 3d transforms)

Bookmarklet

-----------

To use it as a bookmarklet, just prefix the code with "javascript:".

Known Issues

------------

  * Fixed positioned elements may shift in WebKit browsers because of issues with position: fixed; and -webkit-transform's. WebKit has been fixed but the patch hasn't made it into any Chrome/Safari release yet.

  * Firefox doesn't allow JavaScript that was copy-pasted in the URL to have access to most things so this script can't run. Use a bookmarklet instead.

  * Doesn't trigger CSS media queries that use device pixel ratio/min-resolution; so if you use these you'll need to temporarily adjust them. (Pull request anyone?)