Das Problem ist, dass ich ein paar DIV's absolut positioniert habe, die Hintergrundgröße haben: cover; und ihre Höhe wird von Javascript berechnet, um 100% des Ansichtsfensters zu füllen. Auf jedem Desktop-Browser und mobilen Firefox ist alles in Ordnung, aber auf mobilen Chrome-Adressleiste (beim Erscheinen / Verschwinden) ändert sich $ (Windows) .height (); Wert. Das führt zu einem schrulligen Hintergrundbild, das jedes Mal neu skaliert wird, wenn es das tut. Gibt es eine Problemumgehung, um immer die Adressleiste anzuzeigen (so dass sich der Wert für die Fensterhöhe nicht ändert), oder eine andere Lösung, um die Hintergrundgröße beizubehalten: cover; skalieren Sie das gleiche unabhängig von der Adressleiste?
Ich weiß, dass Sie von Chrome sprechen, aber im Fall von Mobile Safari, neu ab ios 7.1, können Sie das Attribut dem Viewport-Tag "minimum-ui" hinzufügen, wodurch die Navigationsleiste und die Adressleiste nicht mehr angezeigt werden vom Ein- und Aussteigen.
In Zukunft werden andere Browser, wie z. B. Mobile Chrome, diesen Wert ebenfalls akzeptieren.
Sie können hier mehr lesen: Ссылка
Ich habe ein kleines vanilla JS ES6 npm-Modul geschrieben, um das Problem zu beheben:
Alles, was Sie tun müssen, ist das Modul zu laden und ein Datenattribut auf jedes Sprungelement zu setzen.
Das macht das Skript (vereinfacht):
Die Quelle wurde nach ES5 kompiliert, um alte Browser zu unterstützen.
Ich verstehe, dass dies eine ältere Frage ist, aber das Chrome-Team hat eine "Reparatur" an diesem Problem vorgenommen, die dieses Problem in Zukunft verhindern soll. Es ist derzeit in Canary, aber es wird hoffentlich bald stabil sein. Es ist für Chrome M56 geplant.
Tags und Links android google-chrome mobile scale background-size