A tiny (900 bytes minified, 470 bytes gziped), functional CSS3 translation transforms API for JavaScript. Supports all browsers supporting CSS3 Transforms. Check out the support grid.
3D transforms - translate.z
and translate.d3
- have a separate support grid.
git clone https://github.com/mattcg/css3-translate.git
cd css3-translate/
make
cp build/translate.min.js /path/to/my-project/js/
Alternatively, use Component, Bower or npm to install to your project as a dependency.
For all translation methods, if a length does not include units, px
will be used.
Apply a translate(tx, ty)
CSS transform to the given element, moving the position of the element on the plane.
If missing, ty
is assumed to be equal to tx
: translate(el, 2)
means translate(el, 2, 2)
.
Apply a translateX(tx)
CSS transform to the given element, moving the element horizontally on the plane.
Apply a translateY(ty)
CSS transform to the given element, moving the element vertically on the plane.
Apply a translateZ(tz)
CSS transform to the given element, moving the element along the z-axis of the 3D space.
Apply a translate3d(tx, ty, tz)
CSS transform to the given element, moving the position of the element in the 3D space.
Get the browser-specific transform rule e.g. 'webkitTransform' or 'transform'.
Copyright © 2013 Matthew Caruana Galizia, licensed under an MIT license.