(Vraiment) longue image d'arrière-plan ne rend pas sur Safari iPad

Pour des raisons inconnues, iPad Safari n'affiche pas vraiment un long arrière-plan de l'image. Dans monl'image de fond est de 1 000 x 10 000 pixels. Le même exemple fonctionne sur n'importe quel navigateur de bureau, par exemple, Safari, Firefox, etc.

Je suis conscient de la background-repeat dans le CSS mais malheureusement, il n'est pas applicable dans mon cas précis.

source d'informationauteur moey

  1. 29

    Mobile Safari a des limites à ce que la taille des images d'arrière-plan, il affiche avant que le sous-échantillonnage, vous pouvez être touché par ce problème à cause de la taille de votre arrière-plan:

    La taille maximale pour décodé GIF, PNG et TIFF est de 3 mégapixels pour les appareils avec moins de 256 MO de RAM et 5 mégapixels pour des appareils avec une plus grande ou égale à 256 MO de RAM.

    Qui est, de s'assurer que la largeur * hauteur ≤ 3 * 1024 * 1024 pour les appareils avec moins de 256 MO de RAM. Notez que la décodé taille est beaucoup plus grande que l'encodage de la taille d'une image.

    voir: Savoir iOS les Limites des Ressources

  2. 13

    Vous pouvez atteindre cet objectif en utilisant plusieurs images d'arrière-plan. Tranchez votre long jpeg en morceaux gérables qui sont conformes à la limite, et ensuite utiliser css3 magie pour les rassembler tous en un même arrière-plan.

    Par exemple, j'ai découpé un 7400px haut de l'image dans 2048px morceaux et placez-les ensemble avec le présent:

    background-image: url('../images/bg_ipad1.jpg'), url('../images/bg_ipad2.jpg'), url('../images/bg_ipad3.jpg'), url('../images/bg_ipad4.jpg');
background-position: center 0px, center 2048px, center 4096px, center 6144px;
background-size: auto auto;
background-repeat: no-repeat;

    Cette charge sur l'iPad à pleine résolution.