all articles

iOS 9.2 webview's viewport breaks when orientationchange

2016-12-15 @sunderls

iOS

description

iOS9.2 webview (UIWebview?) is broken in Facebook or maybe other apps' in-app-browser, I mean broken is that it offers inconsistent window.innerHeight and window.innerWidth after rotating.

here is the result on iOS9.2.1 iPhone6s, LINE in-app-browser

state window.innerWidth window.innerHeight $(window).width() $(window).height()
initial, portrait 414 628 414 736
rotate to landscape 736 370 736 414
rotate to portrait 736 1116 414 736

well jQuery offers the consistent dimensions, but with wrong values( here is the why)

there are some things I happened to trigger this, but newest IOS version have no problem, maybe this is fixed by Apple.

solution

Add shrink-to-fit-no to viewport if anything related to viewport crashes. And it worked, I don't know why.

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">