CODEWITHSUNDEEP
javascriptretina
Clarus Dignus
Clarus Dignus

Reputation: 3897

How can I test retina image substition without retina display?

What I have:

I'm using retina.js to substitute larger sized image variants for retina displays.

What I need:

I need to test that the script is working. My output should read as:

[email protected]

...instead of...

someimage.png

My problem:

I can't find a means of emulating a retina display that will allow me to check the source code.

What I've tried:

  1. Similar questions suggest that I modify Firefox's config however my default value for layout.css.devPixelsPerPx is set to -1 (not 1). Changing to -2 or 2 does not produce the necessary result.
  2. Opera's Device Emulator does not offer me a means of reading the source code.
  3. Chrome has a device mode that allows me to change the device pixel density. The default is 2. Changing the value to 1 or 3 does not produce any noticeable effect.

Upvotes: 1

Views: 150

Answers (1)

Caleb O'Leary
Caleb O'Leary

Reputation: 763

Perhaps you could write a test variable in to the URL, and alert the image source, and use a retina device or that opera emulator.

Something like yoursite.com/app?alertImage=test

(assuming you're using jquery):

if (location.search.indexOf('alertImage') >= 0) {
    alert($('.imageClass').attr('src'));
}

Upvotes: 2

Related Questions