Perbaiki IE 10 pada Windows Phone 8 Viewport - Trik CSS

Anonim
(function() ( 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); ) ))();

Backstory cepat

Agar IE 10 (desktop) berfungsi dalam "mode jepret" baru, Anda perlu menggunakan ini:

@-ms-viewport ( width: device-width; )

Tapi itu mengacaukan beberapa ponsel Windows Phone 8, mengesampingkan tag meta viewport dan merender terlalu besar di layar kecil. Jadi jawabannya, untuk saat ini, adalah skrip deteksi / injeksi perangkat ini.

Cerita latar yang lebih panjang

  • Matt Stow: Desain Responsif di IE10 pada Windows Phone 8
  • Tim Kadlec: Windows Phone 8 dan Device-Width