多说评论头像360度旋转特效

<style type="text/css">
/*头像旋转*/
#ds-reset .ds-avatar img{
width:54px;height:54px; /*设置图像的长和宽*/
border-radius: 27px;/*设置图像圆角效果,在这里我直接设置了超过width/2的像素，即为圆形了*/
-webkit-border-radius: 27px;/*圆角效果：兼容webkit浏览器*/
-moz-border-radius:27px;
box-shadow: inset 0 -1px 0 #3333sf;/*设置图像阴影效果*/
-webkit-box-shadow: inset 0 -1px 0 #3333sf;
-webkit-transition: 0.8s;
-webkit-transition: -webkit-transform 0.8s ease-out;
transition: transform 0.8s ease-out;/*变化时间设置为0.8秒(变化动作即为下面的图像旋转360读）*/
-moz-transition: -moz-transform 0.8s ease-out;
}
#ds-reset .ds-avatar img:hover,#ds-reset div:hover{/*设置鼠标悬浮在头像时的CSS样式*/
box-shadow: 0 0 10px #fff; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1);
-webkit-box-shadow: 0 0 10px #fff; rgba(255,255,255,.6), inset 0 0 20px rgba(255,255,255,1);
transform: rotateZ(360deg);/*图像旋转360度*/
-webkit-transform: rotateZ(360deg);
-moz-transform: rotateZ(360deg);
}
/*实现鼠标指向某条评论的div框架的时候，整个框架背景变色源码：（可用）*/
.ds-post-self:hover {
background-color:#dadada !important;
}

/**实现头像圆角*/
#ds-reset .ds-avatar img{
width:54px;height:54px; /*设置图像的长和宽*/
border-radius: 27px;/*设置图像圆角效果,在这里我直接设置了超过width/2的像素，即为圆形了*/
-webkit-border-radius: 27px;/*圆角效果：兼容webkit浏览器*/
-moz-border-radius:27px;
box-shadow: inset 0 -1px 0 #3333sf;/*设置图像阴影效果*/
-webkit-box-shadow: inset 0 -1px 0 #3333sf;
}
</style>

ps:效果见代码：http://download.csdn.net/detail/he20101020/6681781

看到下载该资源的人评论，貌似该css3不支持ie9及以下的版本，因为我电脑是ie10，开始没测出这个问题，我把文档模式改为标准，本来不支持圆角和旋转的也可以旋转了。

然后，我去虚拟机下的ie8看了下，是没有这个文档模式的。所以说明该效果暂不支持ie9及其以下浏览器。如果哪个发现了比较好的效果，可以分享一下。