IE9,10でcssのtransition、transform、scaleなどを使う方法


そんなあなたに便利なプラグインがあるでごわす。

jquery-animate-css-rotate-scale
jquery-css-transform

この2つを入れておきゃ、間違いねえ!

使い方

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery-css-transform.js" type="text/javascript"></script>
<script src="jquery-animate-css-rotate-scale.js" type="text/javascript"></script>

$('#example').rotate('30deg'); // rotates to 30deg
$('#example').scale(1.5); // scales to 150%
$('#example').rotate('45deg'); // rotates to 45deg
$('#example').rotate(); // will return '45deg'
$('#example').scale(); // will return '1.5'

// Rotate to 30deg and scale to 125%
$('#example').animate({rotate: '30deg', scale: '1.25'}, 1000);
// Rotate by 30deg from current position and scale down by 10%
$('#example').animate({rotate: '+=30deg', scale: '-=0.1'}, 1000);