background-attachment: fixed nie działa - Android Chrome (v40)

Question

Tło

(Zostało askedbefore, many times, wiem jednak, jak się wydaje, zostały spowodowane przez różne rzeczy za każdym razem mam.. przeszły przez około cztery różne wątki odpowiedzi StackOverflow i próbowałem wszystkiego Nic nie wydaje się już działać, więc uważam, że jest to nowy problem.)

W każdym razie, mam element HMTL z obrazem tła, który musi zostać naprawiony , używając background-attachment:fixed;

• Wszystkie przeglądarki stacjonarne - Współpracuje
• Mobile Firefox - Współpracuje
• domyślna Android/Samsung Browser - Współpracuje
• mobilnej Chrome - nie działa

ja obrócił problem w prostszy, powtarzalny test, który jest pojedynczym elementem section, ustawionym na 200% wysokości strony, przy czym tło jest pełnoekranowe i stałe.

---

Kod

html,body { 
 
    padding:0; 
 
    margin:0; 
 
    height:100%; 
 
    width:100%; 
 
} 
 
section { 
 
    background-position:center center; 
 
    background-attachment:fixed; 
 
    background-size:cover; 
 
    background-image:url(http://www.andymercer.net/wp-content/themes/andymercer/images/background/home.png); 
 
    height:200%; 
 
    width:100%; 
 
}

<section>Test</section>

---

JSFiddle do testowania

Dla łatwiejszego testowania na smartfonie niż fragmencie kodu: http://jsfiddle.net/LerLz1L2/

---

Czego próbowałem

• backface-visibility: hidden;
• -webkit-backface-visibility:inherit;
• -webkit-transform: translate3d(0,0,0);
• Ustawienie elementu i wszystkich rodziców do position:static

Answer 1

to działa na prawie wszystkich przeglądarkach oprócz ojczystego Androida przeglądarka

background-image:url(http://www.andymercer.net/wp-content/themes/andymercer/images/background/home.png); 
background-repeat: no-repeat; 
background-position: center center; 
background-attachment: fixed; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover !important; 
max-width:100%; 
max-height:100%; 
width:auto; 

Jest wysoce zalecane, aby ustawić pierwszy

Szukasz rozwiązania bug (background-attachment: fixed) URL obrazu na Androidzie przeglądarce.

Nadzieja pomaga!

Answer 2

Poniższy kod działał dobrze dla mnie w chrome android.

html { 
 
     height:100%; 
 
     background: url(bg.jpg) no-repeat center center fixed; 
 
     -webkit-background-size: cover; 
 
     -moz-background-size: cover; 
 
     -o-background-size: cover; 
 
     background-size: cover; 
 
    }

mam to od here

Answer 3

Miał ogromne problemy z tym - to powtarzający się problem w android (sięga do wersji 4.0.0 przynajmniej), że musi jeszcze być w pełni naprawione. Raport o błędzie: https://issuetracker.google.com/issues/36908439

Moja maszyna do testowania Androida uruchamia Chrome 60 na Androidzie 7.0.0 - wciąż nie w pełni poprawiona. Najlepsze lub wyśrodkowane tła wydają się działać w porządku, ale wyrównanie na dole, a szczególnie na dole, jest koszmarem w Androidzie.

Najlepszy obejście znalazłem jest, aby postawić stały obraz tła do osobnego dedykowanego div, w przeciwieństwie do samej przeglądarki tle ... (

Ustaw div do 100% rzutni Hight i szerokości , podał mu stałą pozycję i indeks z -10, a następnie umieścił wszystkie style tła w tym dziale, pozostawiając puste tło przeglądarki:

Umieszczenie obrazu tła w przeglądarce jest w najlepszym razie lagged, i większość innych obejść, które znalazłem, powoduje przewijanie w starszych przeglądarkach IE. pożądana stylizacja obrazu tła działa idealnie po umieszczeniu w dedykowanym div. Dopiero umieszczenie ich w tle przeglądarki powoduje, że wszystko idzie nie tak.

Mam nadzieję, że to pomoże.