CODEWITHSUNDEEP
cssipadmobileviewport
Kieran
Kieran

Reputation: 61

How to detect lack of position:fixed in a generic way?

On mobile devices such as the iPad, I would like to disable a feature that only works if position:fixed is supported. Is there a way to detect these devices without using the user agent string? The reason is that I would like to avoid searching for iPad, iPhone, iPod, Android, etc if possible.

Upvotes: 4

Views: 3710

Answers (2)

loupiote
loupiote

Reputation: 51

also returns a false-positive on Opera Mini.

Why not simply set a position:fixed on some element and then read it back? If position:fixed not supported returned value, should not be equal to fixed in theory

that does not work on Opera Mini: you can set position to "fixed", it will read as "fixed" even though it is not supported.

Upvotes: 0

James Skidmore
James Skidmore

Reputation: 50298

Run the following function to test for position:fixed support.

function () {
  var isSupported = null;
  if (document.createElement) {
      var el = document.createElement("div");
      if (el && el.style) {
          el.style.position = "fixed";
          el.style.top = "10px";
          var root = document.body;
          if (root && root.appendChild && root.removeChild) {
              root.appendChild(el);
              isSupported = el.offsetTop === 10;
              root.removeChild(el);
          }
      }
  }
  return isSupported;
}

From http://kangax.github.com/cft/#IS_POSITION_FIXED_SUPPORTED

Upvotes: 3

Related Questions