iPhoneのSafariでは大きすぎる背景画像を使うと自動縮小されてしまう

2012/5/2 01:42

CSS で backgroundImage に縦横サイズの大きな画像を指定していたりするサイトを iPhone の Safari で見ると、背景画像が自動的に縮小されてしまうんですね。

あまり大きな画像を使うことがないので知らなかったのですが。

具体的には、縦×横の画素数が 2,000,000 ピクセル(200万ピクセル)を超えるとだめらしいです。

なので、例えば 1,440 x 1,800 のサイズだと画素数が 2,592,000 ピクセルなので、そのままのサイズでは表示できず、縮小されて残念な感じになってしまいます。

一方で、例えば 1,188 x 1,584 のサイズであれば、画素数は 1,881,792 ピクセルで、200万画素より小さいので、縮小されません。

と、ここまで書いて iPad ではどうなんだろう？と気になったのですが、iPad持ってないから実機で確認ができない・・・。

ともかくPC向けサイトをiPhoneで見て背景画像があれ？ってなっていたら、画像の画素数を確認してみましょう。

Webエンジニアやってます。最近はドットインストールの開発がお仕事です。その傍ら、個人で Meity や電車遅延なう、梅酒.in、 #グラドル自画撮り部の部室といったネットサービスを開発・運営してます。梅酒と草野球とリアル脱出ゲームが好きです。