.xwcms {
margin: 0 auto
-webkit-border-radius: 110px
border-radius: 110px
-webkit-transition: -webkit-transform 0.2s ease-out
-moz-transition: -moz-transform 0.2s ease-out
-o-transition: -o-transform 0.2s ease-out
-ms-transition: -ms-transform 0.2s ease-out
}
.xwcms:hover {
-webkit-transform: rotateZ(180deg)
-moz-transform: rotateZ(180deg)
-o-transform: rotateZ(180deg)
-ms-transform: rotateZ(180deg)
transform: rotateZ(180deg)
}
<img src="img/jiaotou.png" class="xwcms" />
一、CSS中鼠标悬停到元素上顺时针转360deg可以使用transition和transform这两个属性；二、正常情况下，transition是加到设置元素样试的CSS中的，而transform是添加到动态伪类选择器:hover后的
三、如果要实现鼠标悬停后元素旋转360不回去，可将transition也加到:hover后面
举例：
<style>
.bg{
width: 200px
height: 200px
margin: 10px
box-shadow: 0 1px 8px #666
}
.bg:hover{
transition: all 0.5s ease-in
transform:rotate(360deg)
}
</style>
<div class="bg"></div>
不知道是不是你要的效果，望采纳！！！
我使用setTimeout() 来延时一秒，但没有效果，不知道什么地方出错了，现列出基本代码，请大家指正。首先，在DIV中添加了鼠标动作：<DIV id="xiexiedajia" onmouseover="showlink()" onmouseout="closelink()">
Javascript代码如下
JavaScript code
?
1
2
function closelink(){window.setTimeout('closel()',1000)}
function closel(){document.getElementById("xiexiedajia").style.display="none"}
实现延时一秒的作用是当用户将鼠标点在菜单并往右移动时，偶尔可能移出菜单，这时候菜单就会消失，用户又要重新点开菜单，很不爽，希望能够在鼠标移出很短时间内菜单仍旧存在，这时候用户鼠标又移入时菜单还在。
当用户将鼠标移出超过1秒后就认为用户本身不想使用菜单了，这时候菜单就消失。
