Retinaディスプレイ判別で自動で高解像度画像を出しわけ可能な単独ライブラリ「Retina.js」
2012年04月12日-
スポンサード リンク
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なんかにキャッシュさせつつ意図的にクリアさせる仕組みも入れたほうがよさそうですが、小さなサイトでは便利に使えそうです
関連エントリ
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なんかにキャッシュさせつつ意図的にクリアさせる仕組みも入れたほうがよさそうですが、小さなサイトでは便利に使えそうです
関連エントリ
スポンサード リンク
By.KJ : 2012年04月12日 09:03 
間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)Advertisements
SITE PROFILE
最新のブログ記事(新着順)
- くちばしフォント【商用可】
- 小説表紙などに使えそうな商用可なフォント「になロマン」
- 筆で書いたようなカナ書体「筆竹仮名B」
- 無料・商用利用可な丸文字ピクセルフォント「マルミーニャＭ」
- スペースコブラ風フォント
- Next.jsのVercelから商用利用可能なフリー汎用フォント「Geist Font 」
- 無料で使えるいい感じの日本語フォント「しっぽり太ゴシック」
- CSSのみで実装された５００種類のローディングアニメーション「CSS Loaders」
- 画像ホバーで様々なエフェクトをかけられる「Izmir」
- CSSのbox-shadowをGUIで生成できる「CSS Box Shadows Generator」
- 過去のエントリ
