Element.Style.Transform 0.4.1

Provides a cross browser way of letting you use the CSS3 transform property. Inspired by http://github.com/zachstronaut/jquery-css-transform



Details

Author
Stian Didriksen
Current version
0.4.1
GitHub
stipsan/Element.Style.Transform.js
Downloads
2877
Category
Native
Tags
Report
GitHub Issues

Releases


Dependencies

  • core:1.2.4/Browser/core: 1.2.4
  • core:1.2.4/Element/core: 1.2.4

How to use

$('box').set('transform', 'scale(2)')
        .get('transform');           // Returns 'scale(2)'

$('box').setTransform('rotate(15deg)')
        .getTransform();              // Returns 'rotate(15deg)'

$('box').getStyle('transform'); unfortunately does not work. Neither does setStyle. I haven't found a way to extend those methods to make it work cross browser engine yet. So with those, you'll have to use the correct browser vendor prefixes.

$('box').getStyle('webkit-transform') // Safari and Chrome
        .getStyle('moz-transform')    // Firefox
        .getStyle('o-transform');      // Opera

Ie Support Isn T There Yet

As this post explains near the end: http://www.zachstronaut.com/posts/2009/02/22/jquery-patch-css-transform.html Using IEs matrix filter directly can make it possible to animate it. However the Matrix Filter is anything but easy to wrap your head around: http://msdn.microsoft.com/en-us/library/ms533014(VS.85).aspx So please be patient :)


Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.

blog comments powered by Disqus