Weird Blocking auf iOS Safari auf Bildlauf

Beim Versuch, einige Probleme mit einigen Folien in Browsern zu beheben, erreichte ich einen Punkt, in dem alle Browser gut funktionieren, aber Safari für iOS nicht.Weird Blocking auf iOS Safari auf Bildlauf

Überraschende Sache ist, dass es nicht auf Mac Safari im Responsive Mode passiert, es geschieht nur auf iOS.

Das seltsame Verhalten ist, dass, wenn Sie die unten auf der Seite zu erreichen, einen Teil des Inhalts bedeckt ist. Wenn Sie erneut scrollen, sobald Sie den unteren Rand erreicht haben, können Sie jetzt scrollen. Es wird dasselbe passieren, wenn Sie an dieser Stelle nach oben scrollen.

Minimal Testfall, in denen dies reproduzierbar:

html, 
body, 
main { 
    width: 100vw; 
    height: 100vh; 
    overflow: hidden; 
} 


#test { 
    height: 100vh; 
    overflow-x: hidden; 
    overflow-y: scroll; 
    -webkit-overflow-scrolling: touch; 
} 

p { 
    padding: 20px 0; 
}

Markup ist wie folgt:

<body> 
    <div id="test"> 
    <p>Lots of p</p> 
    <p>Lots of p</p> 
    <p>Lots of p</p> 
    </div> 
</body>

JSBin mit reproduzierbaren Fall ist this. Weiß jemand, was hier passiert und wie man es repariert?

Quelle

2017-02-27 Antonio Laguna

Ich habe das gleiche Problem! Gibt es eine Lösung? –

Ich hatte das gleiche Problem und anscheinend ist es wegen eines Fehlers mit '100vh' und Ios Safari. Sobald ich zu '100%' gewechselt habe, war alles in Ordnung, abhängig davon, wo Sie Ansichtsfensterhöhen verwenden müssen, aber dies ist möglicherweise nicht immer möglich.

ref: http://webdesignerwall.com/tutorials/css-fix-for-ios-vh-unit-bug

obwohl andere Websites nicht mehr zu bedeuten scheinen könnte dies ein Fehler sein.

Quelle

2018-01-10 23:37:22 Sam0

Weird Blocking auf iOS Safari auf Bildlauf

Antwort

Verwandte Themen