原点设置一次即可,不需要多次设置,只要在转180度以后,再次旋转180度(也就是从180度转到360度)即可,继续累加就继续转(可以超过360度)。比如:
<style>div {
position:absolute
left:200px
top:200px
transform-origin:-30px center
transition:all 1s
}
</style>
<button>旋转180度</button>
<div>文字A</div>
<script>
var jd=0
window.onload=function(){
document.querySelector("button").onclick=function(){
jd+=180
document.querySelector("div").style.transform="rotate("+jd+"deg)"
}
}
</script>
首先给ul取名为 class="ultest"(随便写的)var ultestItem = $('.ultest li'),
liitemLen = ultestItem.length,
linesItem = 4//定义几个一种颜色
var colorbg//颜色初始化
for (var i = 0i <Math.floor(liitemLen/linesItem)i++) {
switch(i){
case 0: colorbg = "red"break
case 1: colorbg = "black"break
case 2: colorbg = "gray"break
case 3: colorbg = "yellow"break
}
for (var j = 0j <linesItemj++) {
$(ultestItem[(i*linesItem+i)]).css("background", colorbg)
}
}
因为是这样的你的css对hover的设定是#button a:hover 也就是id为button内的<a>超链
但是你真正想实现效果的是button
所以应该这么写css:
#button:hover
也就是#button的hover 而不是a的hover
:)