Web development for Windows Phone

  • Article

Internet Explorer for Windows Phone is based on Internet Explorer for the desktop; however, there are differences that web developers should consider. This topic describes some of these differences on a high level for Internet Explorer 11 on Windows Phone 8.1 and previous versions.

IE on Windows Phone 8.1

In addition to the differences below for the original Windows Phone 8.1 release, see IE for Windows Phone 8.1 Update for more new and changed features coming with the next IE updates on Windows Phone 8.1.

Additional features

The following features are supported in IE for Windows Phone 8.1, but are not supported in IE11 for the desktop.

  • The viewport META tag and its settings
  • Text scaling and the CSS property -ms-text-size-adjust

Unsupported features

The following features are supported in IE11 for the desktop, but are not supported in IE for Windows Phone 8.1.

  • Linking to a Store app using msApplication-ID or msApplication-PackageFamilyName
  • CSS Touch Views, except for overflow: scroll accelerated scrolling, which is supported
  • Rotation and angular gesture events
  • -ms-hyphens
  • Drag and drop
  • VBScript
  • ActiveX
  • Active documents
  • Extensibility through Browser Helper Objects (BHOs), toolbars, and other related items
  • Older web technology, such as binary behaviors, HTCs, HTML+TIME, and VML
  • Encrypted Media Extensions (EME) for HTML5 video

IE on Windows Phone 8.0

Additional features

The following features are supported in IE for Windows Phone 8.0, but are not supported in Internet Explorer 10 for the desktop.

  • HTML5 geolocation using GPS
  • The viewport META tag and its settings
  • Text scaling and the CSS property -ms-text-size-adjust
  • Customizing and disabling link highlighting, such as <meta name-"misapplication-tap-highlight" content="no"/>

Unsupported features

The following features are supported in Internet Explorer 10 for the desktop, but are not supported in IE for Windows Phone 8.0.

  • InPrivate browsing
  • The overview, scroll, and accelerated scrolling CSS touch views
  • Rotation and angular events as related to gesture events
  • -ms-hyphens
  • Inline HTML5 video
  • VBScript
  • ActiveX
  • Cross-window communications, such as the ability to target a window using script
  • Extensibility through browser helper objects, toolbars, and other related items
  • Older web technology, such as binary behaviors, HTCs, HTML+TIME, and VML

IE on Windows Phone 7.1

Additional features

The following features are supported in IE for Windows Phone 7.1, but are not supported for the desktop version of Windows Internet Explorer 9.

  • HTML5 geolocation using GPS
  • The viewport META tag and its settings
  • The CSS property -ms-text-size adjust

Unsupported features

The following features are supported in the desktop version of Internet Explorer 9, but are not supported in IE for Windows Phone 7.1.

  • InPrivate browsing.
  • Tracking protection.
  • Anti-phishing support.
  • Backwards compatibility for Windows Internet Explorer 8 documents (IE for Windows Phone 7.1 renders these documents in IE9 mode)
  • Downloadable fonts such as EOT, TTF/OTF, and WOFF fonts
  • CMYK images.
  • The overview, scroll, and accelerated scrolling CSS touch views
  • Rotation and angular events as related to gesture events
  • -ms-hyphens
  • Multi-stream HTML5 audio
  • Inline HTML5 video
  • VBScript
  • ActiveX
  • Full support for complex script languages in all document modes
  • Surrogate pairs
  • JIT support for JScript
  • Some <video> tag attributes and events. IE for doesn't support preloading audio or video files, and doesn't support automatic playback of audio or video files. For this reason, the preload, autoplay, canplay, and canplaythrough events are unsupported
  • Cross-window communications, such as the ability to target a window using script
  • Extensibility through browser helper objects, toolbars, and other related items
  • Older web technology, such as binary behaviors, HTCs, HTML+TIME, and VML/

Controlling the viewport

The viewport layout is a rectangular region that controls how the document's content is laid out and where text wraps on the page. IE for Windows Phone supports the following viewport meta tag and value paired settings.

Property Value
width Sets the width of the viewport. This can be any integer number or device-width. The range is from 320 to 10,000. The default value is 320. On devices with Windows Phone 8 Update 3 (that is, with a version equal to or greater than 8.0.10492), device-width returns a value that is 160 * the physical screen width in inches. If the physical screen width cannot be determined, then device-width returns an estimate which is proportional to the screen resolution.
height Sets the height of the viewport. Can be any integer number or device-height. The range is from 480 to 10,000.
user-scalable Indicates whether the user can scale the viewport (yes) or not (no). The default and recommended value is yes.

 

Note  Although available in some browsers, the minimum-scale, maximum-scale, and initial-scale properties are currently unsupported for Internet Explorer for Windows Phone.

 

The Internet Explorer for Windows Phone 8.1 Update adds support for dynamically changing viewport directives (either by modifying an existing meta element's content value or appending a new meta element). In document order, the last <meta name="viewport"> with non-empty content attribute is used.

Adjusting text size using custom CSS

IE for Windows Phone gives developers the option to control the webpage text size by setting the –ms-text-size-adjust CSS property. When the user double-taps a page element, IE for Windows Phone scales the viewport to position the double-tapped element within the visible area of the screen. The corresponding text also is scaled to a legible size. Developers may choose to either control the adjusted text size or turn it off.

Note  The –ms-text-size-adjust property is ignored where the viewport tag is present.

 

The following example turns off text size adjustment for an HTML page:

html { -ms-text-size-adjust:none }

The following example turns on automatic text size adjustment for the body of an HTML page:

body { -ms-text-size-adjust:auto }

The following example adjusts the text size by 150 percent for a division of an HTML page:

div { -ms-text-size-adjust:150% }

Fixed positioning

Elements that are positioned using CSS fixed positioning behave differently between IE for Windows Phone OS 8.0 compared to IE for Windows Phone OS 7.1. InIE for Windows Phone OS 8.0 (as well as on the desktop), fixed elements are positioned relative to the client view of the browser window. This means that if an element is fixed in view at the bottom right corner, it will always appear fixed in view at the bottom right corner even when the user scrolls the page up, down, left, or right. On Windows Phone OS 7.1, fixed elements are positioned relative to the document itself and may not remain in view when the user scrolls the page. This means that if an element is fixed relative to the bottom right corner of a document, the user will see it only when navigating to the bottom right corner of the webpage.

Note  

When a user zooms in or out in a document, fixed elements scale accordingly.

 

Unsupported plug-ins

Unlike the desktop browser, in IE for Windows Phone users can’t download or install third-party plug-ins, such as ActiveX controls. Webpages shouldn’t prompt users to download plug-ins.