IE8でのtransform使用

CSS3のtransformは、画像を魅力的に見せる場合などに、さまざまな演出が出来ます。

transformは、CSSだけで画像やboxなどを回転させたりできます。

しかし、IEなどはCSS3の対応は遅れているのが現状です。
ですが、transformなどの変形は、IE5の頃から、類似したものは実装されていたようです。

今回は、
filterを利用し、CSS3のみで類似の表現ができる、CSSのスニペットを紹介します。

.transform {
  -ms-transform: rotate(180deg);  /* IE9 */
  transform: rotate(180deg);
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); /* IE5.5+ */
}

上記では要素を回転されることができます。
filterの場合は、(rotation=2)の1～4の間で、90度毎に回転させることができます。