iPad/ios6でpngの背景画像が表示されない

ios5では、ウェブサイトが正常に表示され、正しく表示されます。iPad/ios6でpngの背景画像が表示されない

バックグラウンドとしてpngイメージを使用している私のウェブサイトのセクションは、iPad上でレンダリングを開始しますが、バックグラウンドは明白な理由で黒に変わります（他のセクションはすべて正しい色を維持します）。

コード：

<section id="showcase"> 
    <section class="container"> 
    <img src="images/usp.jpg" alt="USP Screen" id="screen"> 

    <h2>title</h2>  

    <p>the text.</p> 

    <p>The text.</p> 
    </section></section>

CSS：

#showcase   { background: url(../images/showcasebg.png) repeat-x #ededed; height: 600px; position: relative; top: 87px; } 
#showcase h2  { float: left; max-width: 422px; font-family: 'Lobster', cursive; font-size: 36px; margin-top: 20px; } 
#showcase p   { float: left; max-width: 422px; margin-top: 20px; }

出典

2012-09-24 John

あなたのサイトへのリンクはありますか？他の何かが間違っているかもしれません。 – Kyle

残念ながら現時点では可能ではありませんでしたが、私は誰かがios6にアップグレードしてから同様の問題を抱えている可能性があり、答えを見つけた可能性があります。 – John

それが直接関係している場合、私はわからないんだけど、私は昨夜同様の問題がありました。私はイメージの相対URLを使用していましたが、iOS6が％20の代わりに％2520としてイメージパス内のスペースをエンコードしていることがわかりました。これは私にとっては問題でした。なぜなら、私はシミュレータのアプリケーションでWebビューで画像リソースを表示していたため、シミュレータが提供するリソースへのパスにスペースが含まれていました。これはデバイス上の問題ではなく、パスにスペースがありません。

何が起きているのかを判断するのに非常に便利な新しいリモートインスペクタ（ここでは、http://www.mobilexweb.com/blog/iphone-5-ios-6-html5-developers）が見つかりました。

出典

2012-09-25 22:18:24

同様の問題があります。私のウェブサイト（http://paulcremoux.com/en/trabajo/）の作業セクションの下にあるすべてのページに長いpngがあります。多くの場合、イメージのロードが完了する前に停止することがあります。それ以外の時間にはロードし、次にクラッシュを分類します。（最初は正常に動作するように思われるので、いくつかのページを見る必要があります）

ios6でのみ発生します。

出典

2012-09-26 14:57:02

私たちも同様の問題がありました。

PhotoShopでPNGを開いて再保存した後、大丈夫と表示されました。私たちはカラープロファイルなどを変更しませんでした。それを開いて、すべての設定を同じままにして、再度保存しました。

サイトには数多くのPNG背景がありますが、2つの特定のPNGだけが正しく表示されませんでした。だから我々はおそらく、特にそれらの2人は、最初に作成されたときに不具合や何かで救われたと思うかもしれません。

誰が知っていますか。 shrug

出典

2012-09-27 01:50:02 user1685048

iOS6 Safariで同じ問題が発生しました。黒く見えるrepeat-x .PNG背景画像。時間がかかりすぎて、私はそれを.JPGとして保存し、レンダリングの問題を解決しました。

出典

2012-09-27 10:33:29 user1702989

本当に答えは... –

どのように答えではありませんか？デバイスにはさまざまな機能があります。それは解決策ではありませんか？ – Kir

何私のために働いたことはすべてのために同じではありませんでした：

それはインターレース
にいくつかの画像を削除することで働いていたいくつかの画像は、私はインターレースを削除したが、その後、同様の透明性を取り除くために持っていたし、これが見えました問題を解決する
私は幅をつぶしてみましたが、それはどちらかと思っていません。

ちょうど私の経験

出典

2012-10-06 01:30:21 estern

私たちのサイトの一つにも、この問題に遭遇しました。グラデーション用の背景PNG画像を使用するモバイルサイトがありましたが、これはiOS6（ChromeとSafari Apps）に黒いバーとして表示されました。

は私がノンインターレース PNG画像として保存されて

少なくとも10pxの広い
としてWeb用の画像を再保存することで簡単に固定しました
これはすぐに私の問題を解決しました。

出典

2012-10-08 16:39:02 flynnduism

iOSは1pxワイドの画像をサポートするほどスマートです。精度は根本的な問題であると思われます。 – Zenexer

ノンインターレースPNGとして画像を保存するだけで問題ありません – mixable

ちょうどこれと同じ問題が発生しました.を保存し直して、この問題を解決しました。

出典

2012-10-22 12:40:41 Paul

ウェブサーバーでこれが発生しました。解決策は、PNGを8ビット整数精度から32ビットに変更することでした。明らかに、iOSは8ビットを正しく処理できません。私は16ビットについては知らない。私は、Photoshopが画像の複雑さが低いため（単純なグラデーション）、これを自動的に行ったと思います。 GIMPで簡単に修正することができました：Image -> Precision -> 32-bit integer

出典

2012-11-22 04:28:09 Zenexer

注：画像はインターレースされておらず、1ピクセル幅です。 – Zenexer

私のimgのサイズを変更すると動作するようですが、ズームするといくつかの奇妙な問題が発生します...最終的に、私にとって最高の解決策はjpgとして画像を保存しています。

出典

2013-02-19 02:04:09 Beppe

iPad/ios6でpngの背景画像が表示されない

答えて

関連する問題