jQuery Retina Display Plugin
Con un script puedes hacer que tus imágenes se vean perfectas en pantallas Retina Display
Las dos últimas versiones de iPhone, el iPod Touch de cuarta generación y ahora también en la pantalla del nuevo iPad de tercera generación, tienen esta tecnología y existen diferentes opciones para conseguir que las imagenes se vean perfectas en sus pantallas:
- Retina Images es un script en PHP y JavaScript que trabaja con las propiedades de las imágenes y las cookies, configurándolo correctamente es posible tanto mostrar imágenes tanto en HTML como CSS.
- Retina.js es un script JavaScript
- jQuery Retina Display Plugin es un plugin de jQuery que busca en la web las imágenes en alta resolución y usa el modificador @2x descrito por Apple para imágenes de alta resolución
jQuery Retina Display Plugin
A simple way to add Retina Display support to your website.
The jQuery Retina Display plugin will substitute high resolution versions of your images (if they exist) for high resolution displays (such as iPhone 4) only.
This plugins requires no client-side changes , other than the inclusion and initialisation of this plugin. If the 2x image doesn’t exist, the standard resolution image is displayed. This allows for selective addition of high resolution images.
Demo
Of course, you will need to view these demos on an iPhone 4.
Usage
<script src="js/jquery.retina.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $('img').retina(); }); </script>The example above shows an attempt to replace all images with high resolutions versions. If you only want to attempt to replace some images (for better performance) you may specify a specific class: Eg.
$('img.retina').retina();
Download
