translateDOMPositionXY.js 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. /**
  2. * Copyright (c) 2013-present, Facebook, Inc.
  3. *
  4. * This source code is licensed under the MIT license found in the
  5. * LICENSE file in the root directory of this source tree.
  6. *
  7. * @typechecks
  8. */
  9. 'use strict';
  10. var BrowserSupportCore = require("./BrowserSupportCore");
  11. var getVendorPrefixedName = require("./getVendorPrefixedName");
  12. var TRANSFORM = getVendorPrefixedName('transform');
  13. var BACKFACE_VISIBILITY = getVendorPrefixedName('backfaceVisibility');
  14. var translateDOMPositionXY = function () {
  15. if (BrowserSupportCore.hasCSSTransforms()) {
  16. var ua = global.window ? global.window.navigator.userAgent : 'UNKNOWN';
  17. var isSafari = /Safari\//.test(ua) && !/Chrome\//.test(ua); // It appears that Safari messes up the composition order
  18. // of GPU-accelerated layers
  19. // (see bug https://bugs.webkit.org/show_bug.cgi?id=61824).
  20. // Use 2D translation instead.
  21. if (!isSafari && BrowserSupportCore.hasCSS3DTransforms()) {
  22. return function (
  23. /*object*/
  24. style,
  25. /*number*/
  26. x,
  27. /*number*/
  28. y) {
  29. style[TRANSFORM] = 'translate3d(' + x + 'px,' + y + 'px,0)';
  30. style[BACKFACE_VISIBILITY] = 'hidden';
  31. };
  32. } else {
  33. return function (
  34. /*object*/
  35. style,
  36. /*number*/
  37. x,
  38. /*number*/
  39. y) {
  40. style[TRANSFORM] = 'translate(' + x + 'px,' + y + 'px)';
  41. };
  42. }
  43. } else {
  44. return function (
  45. /*object*/
  46. style,
  47. /*number*/
  48. x,
  49. /*number*/
  50. y) {
  51. style.left = x + 'px';
  52. style.top = y + 'px';
  53. };
  54. }
  55. }();
  56. module.exports = translateDOMPositionXY;