ブログの記事内画像を楽してRetinaディスプレイに対応させる方法
「Retina な Mac を買ったはいいけど、自分のWebサイトやブログの画像がぼやけて見えるのが気になる」という方は多いと思います。 ロゴ画像であれば Illustrator から SVG 形式で書き出すだけで対応できますが、やっかいなのがブログ本文内の画像です。 メインビジュアルの画像など限られたものであれば、たとえば「image.jpg」という画像の Retina 用として「image@2x.jpg」という縦横2倍の画像を用意することもできると思います。 しかし、ブログ本文内の画像は数も多く、「image@2x.jpg」のようなファイル名の画像もいちいち用意していられないと思います。 そこで、このブログでは jQuery 用の JavaScript を使ってなるべく手間のかからない対応をすることにしました。 このブログでは、WordPress で記事を書くときに［メディアを追加］を
Responsive imagesのための-webkit-image-set() - fragmentary
AppleがWebKitに-webkit-image-set()なるものを実装した。 Changeset 111637 – WebKit ― Implement image-set Bug 80322 – Implement image-set なにかというと、Retina displayやらPCとデバイスピクセル比が違うディスプレイに対して、違う画像を出し分ける、いわゆるResponsive imagesと呼ばれてるやつのための仕組み。 こんな感じで書くらしい。 selector { background: -webkit-image-set( url(foo-lowres.png) 1x, url(foo-highres.png) 2x ) center; image-set()内には複数の"imagespec"というものが入る。imagespecは<image>（画像、グラデーション
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
30+ Retina Ready wordPress Themes | Tripwire Magazine
