Detect Orientation Change on IE10 Metro with JavaScript

Question

I have a variable height div fixed div that can change height on orientation change, so ideally I wanted to change the CSS by javascript. However on IE10 Metro using the Surface I can't find any JS event that deals with this? iOS and Chrome both handle it fine.

I have tried onorientationchange and onresize to no avail...

Answer 1

IE 10 doesn’t support Device Orientation Events[0], unfortunately. They do have a prototype[1], but this wont help for browsers that have already been released.

Depending on what you want to do, you may be able to use the orientation Media feature[2] to set a different CSS height value when in portrait or landscape. This is supported by IE[3]

• [0] http://caniuse.com/#feat=deviceorientation
• [1] http://blogs.msdn.com/b/ie/archive/2012/08/30/exploring-device-orientation-and-motion.aspx
• [2] http://www.w3.org/TR/css3-mediaqueries/#orientation
• [3] http://msdn.microsoft.com/en-us/library/ie/hh772710(v=vs.85).aspx