Windows Phone 8 viewport

En suivant les recommandations CSS du viewport, on peut observer un bug dans IE10 pour windows phone 8.

[pastacode lang= »css » message= » » highlight= » » provider= »manual »]

@-webkit-viewport{width:device-width}
@-moz-viewport{width:device-width}
@-ms-viewport{width:device-width}
@-o-viewport{width:device-width}
@viewport{width:device-width}

[/pastacode]

Pour que le mobile prenne en compte les pixels CSS et non ceux du téléphone, un petit script javascript, à placer avant tous les autres scripts, nous sauve la vie !

[pastacode lang= »javascript » message= » » highlight= » » provider= »manual »]

if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
  var msViewportStyle = document.createElement("style");
  msViewportStyle.appendChild(
    document.createTextNode(
      "@-ms-viewport{width:auto!important}"
    )
  );
  document.getElementsByTagName("head")[0].
    appendChild(msViewportStyle);
}

[/pastacode]


Laisser un commentaire

*Champs obligatoires

dd520a83a92311029b3daa47c5940e30333333333