Last Updated: September 09, 2019
·
719
· oshalakhin

Simply retinify images

Sometimes you just want to retinify images you know to have @2x. retina.js doesn't work and query.retina tries to check if @2x files exist and in my case static was on another domain – Rackspace CloudFiles so it raises CORS alert. As it was very simple I decided to implement this few lines of code myself. :-) Okay, lazy but...

Anyway if you find it helpful for you feel free to use it! And have a nice day/night wherever you are !

$ ->
    # Retina is here
    if window.devicePixelRatio >= 2
        retinaImages = $ 'img[data-retina]'
        retinaImages.each (i) ->
            retinaImages[i].src = $(retinaImages[i]).data('retina')

[http://oshalakhin.github.io/retinify.js/]: http://oshalakhin.github.io/retinify.js/

3 Responses
Add your response

May be there could be more improvements someone will need so feel free to ask or contribute http://oshalakhin.github.io/retinify.js/

over 1 year ago ·

Hey Oshalakhin

Could you show a markup example please. Interested in the plugin.

Thanks.

over 1 year ago ·

Sure! For images you want to retinify just add data-retina:

<img src="some/image.png" data-retina="some/image@2x.png">
over 1 year ago ·