2

I have a HTML5 compass that works quite ok. Now I need a smart way to distinguish between "pseudo deviceorientation enabled" browsers (as desktop chrome and FF) and real candidates like iPhone/Android/iPad Browsers that use the device's magnetometor.

My current solution is a basic check for the DeviceOrientationEvent and touch support:

if (window.DeviceOrientationEvent && 'ontouchstart' in window) {
  // setup real compass thing, with event.alpha
} else {
  // setup some mouse following hack
}

Is that enough? I'm not really sure about devices "with touch support but no magnetometer", as for example chrome on a mac book has touch support, and a fake deviceorientation?

4

1 回答 1

3

it seems to work as is, I was wrong, chrome on mac book is not going into the "real compass" section. should have tested it, maybe.

if (window.DeviceOrientationEvent && 'ontouchstart' in window) {
    // setup real compass thing, with event.alpha
    document.body.innerHTML = "haz!";
} else {
    // setup some mouse following hack
    document.body.innerHTML = "nope";
}

check yourself: http://jsfiddle.net/benzkji/J58ef/

remains what happens if a touch enabled windos laptop with deviceorientation enabled chrome is showing up. probably check the "absolute" property of the deviceorientation event: https://developer.mozilla.org/de/docs/WebAPI/Detecting_device_orientation

于 2014-02-28T14:21:54.710 回答