HTML viewport tag sometimes ignored in mobile Chrome on first visit -

HTML viewport tag sometimes ignored in mobile Chrome on first visit -

for adaptive website, utilize viewport meta tag forcefulness device show page in "preferred" screen resolution (not actual device resolution, "smallest" resolution initial scale 1.0).

viewport meta tag:

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0">

this seems work on devices, but, on mobile chrome , on ios devices, first/uncached visit not observe device's "preferred" resolution right away, communicates actual screen resolution.

setup reproduce error (in head section of page):

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0"> <script type="text/javascript"> alert(window.innerwidth); </script>

first/uncached visit show "980" nexus 5, sec visit/refresh show desired "360".

does know way forcefulness window utilize initial scale, without javascript timeout or window onload workarounds?

edited: checking window.innerwidth after window.onload returns desired "preferred" width. workaround now...

i found solution: window.innerwidth somehow delayed , returns value of not-viewport-resized document width in early stage of page load. document.documentelement.clientwidth seems have no problems when calculating window width in early page load stage.

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0"> <script type="text/javascript"> // utilize calculate device width rules before window.onload alert(document.documentelement.clientwidth); </script>

note: able utilize window.innerwidth later on, e.g. after window.onload.

html mobile viewport meta-tags