Retina.js | Retina graphics for your website

Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」
<img src="/images/my_image.png" /> という画像タグがあったとするとスクリプトがサーバ上の"/images/my_image@2x.png"というファイルを自動でチェックして存在すれば置き換えてくれます。
インストールはretina.jsを読み込むだけというお手軽さがいいです。
単に高解像度で出したい部分だけファイルを用意して置いてあげればよいというのはお手軽ですね。



<script type="text/javascript" src="/scripts/retina.js"></script> を</body>の前、ページの最後あたりで記述します。
いちいちサーバ側にチェックしにいってしまうということもあり、大きなサイトではlocalStorageなんかにキャッシュさせつつ意図的にクリアさせる仕組みも入れたほうがよさそうですが、小さなサイトでは便利に使えそうです

関連エントリ

• リアルなドラッグ＆ドロップが実現できるjQueryプラグイン「pep.jquery.js」
• 高機能なカルーセルを実装するjQueryプラグイン５０まとめ
• ページめくりを実現するためのjQueryプラグイン集