CSS3实现的一个简单的图片旋转以及移动特效，使用的是transform属性。浏览示例请在IE9及以上或者其他支持CSS3transform的浏览器上浏览。

代码：

#contentMain{
	margin-bottom:50px;
}
.Item {
	width: 150px;
	height: 150px;
	margin-top: 100px;
	margin-left: 300px;
	position: absolute;
}
.Item2 {
	margin-left: 500px;
	position: absolute;
}
.Item>img {
	width: 150px;
	height: 150px;
	position: absolute;
	border: 3px solid #fff;
	-webkit-box-shadow: 1px 0px 15px #ccc;
	-moz-box-shadow: 1px 0px 15px #ccc;
	box-shadow: 1px 0px 15px #ccc;
	transition-duration: .5s;
}
.Item>img:nth-child(1) {
	-webkit-transform: rotate(10deg);
	-moz-transform: rotate(10deg);
	transform: rotate(10deg);
}
.Item>img:nth-child(2) {
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	transform: rotate(-10deg);
}
.Item:hover img:nth-child(2) {
	margin-left: -150px;
	-webkit-transform: rotate(-370deg);
	-moz-transform: rotate(350deg);
	transform: rotate(350deg);
}
.Item:hover img:nth-child(1) {
	-webkit-transform: rotate(370deg);
	-moz-transform: rotate(370deg);
	transform: rotate(370deg);
	margin-left: 150px;
}