Ver Mensaje Individual
  #4 (permalink)  
Antiguo 06/11/2011, 19:33
cequiel
 
Fecha de Ingreso: mayo-2007
Ubicación: España
Mensajes: 147
Antigüedad: 17 años
Puntos: 3
Respuesta: css transform y obtener la posición actual

Después de investigar un poco he descubierto que el problema de la posición ocurre sólo en Firefox. El resto de los exploradores me devuelven la posición correcta. Si estáis usando la librería jQuery (os lo recomiendo), la forma de arreglar esto es sobreescribir la función "offset":

Código Javascript:
Ver original
  1. (function($) {
  2.     var originalMethod = $.fn.offset;
  3.    
  4.     $.fn.offset = function() {
  5.         var target = $(this);
  6.         var offset = originalMethod.apply(this, arguments);
  7.         var transform = target.css('-moz-transform');
  8.         if ((transform != null) && (transform.length > 0)) {
  9.             var re = /matrix\((.*)\)/;
  10.             var result = re.exec(transform);
  11.             if (result != null) {
  12.                 var params = result[1].split(',');
  13.                 var x = -target.width() / 2;
  14.                 var y = -target.height() / 2;
  15.                 var a = parseFloat(params[0]);
  16.                 var b = parseFloat(params[1]);
  17.                 var c = parseFloat(params[2]);
  18.                 var d = parseFloat(params[3]);
  19.                 var tx = parseFloat(params[4]);
  20.                 var ty = parseFloat(params[5]);
  21.                 offset.left += (a - 1) * x + c * y + tx;
  22.                 offset.top  += b * x + (d - 1) * y + ty;
  23.             }  
  24.         }
  25.         return offset;
  26.     }
  27. })(jQuery);

Lo que estamos haciendo con el código de arriba es "arreglar" la función offset() de jQuery de manera que devuelva la posición correcta de un elemento al que se le ha aplicado una transformación.