0

The CSS transform-origin property has different behavior in different browsers. (For example, try the snippet in this question in Chrome vs. FF40 vs. FF42 (developer's edition). In FF40 the origin for the transformation is incorrect while in the other two it is correct.

I need to figure out if transform-origin works correctly or not in a given browser in order to determine if I should fall back to JS. So, while not ideal, false negatives are acceptable, but false positives are not. What's the best way to detect the behavior of transform-origin?

Community
  • 1
  • 1
JKillian
  • 18,061
  • 8
  • 41
  • 74
  • Wait a bit, a version of Firefox that works will be released presently. Or avoid using percentages as units in the meantime. – Robert Longson Sep 14 '15 at 21:35
  • @RobertLongson I'm actually using pixels not percentages. I know a version of FF will be released where things work correctly, but there's no guarantee all users will have that version anytime soon. I could fall back to JS for all of FF, but that's not ideal, and I don't like doing feature detection by UA. – JKillian Sep 14 '15 at 21:37
  • 1
    I've provided an answer to the original question that works everywhere. Will that do? My answer to this question is then, you don't need to detect support if you know how to bodge it instead. – Robert Longson Sep 14 '15 at 21:50
  • @RobertLongson Yep, that works really well for my use case, thank you. – JKillian Sep 14 '15 at 21:56

1 Answers1

0

I think this answer will help you to detect transform-origin property with some to changes to code in answer, but with some JS:

if ('WebkitTransformOrigin' in document.body.style 
 || 'MozTransformOrigin' in document.body.style 
 || 'OTransformOrigin' in document.body.style 
 || 'transformOrigin' in document.body.style) {
    alert('I can Rotate!');
}
Community
  • 1
  • 1
AleshaOleg
  • 2,171
  • 1
  • 15
  • 29
  • 1
    The property exists in Firefox 40, it just doesn't really work very well for SVG content in that version so your test will succeed when it shouldn't. – Robert Longson Sep 15 '15 at 05:40