当鼠标悬停在元素中时,我需要动画,但是当用户使鼠标悬停时,动画停止在本地当前。当鼠标悬停在元素JS或Jquery中时循环
countRotate = 0;
adiciona = true;
$('.circulo-left').mouseenter(function(){
$('#circuloprincipalcomabaazulclaro').css('transform', 'rotate('+countRotate+'deg)');
if(adiciona == true){
countRotate++;
if(countRotate == 360){
adiciona = false;
}
}else{
countRotate = countRotate - 1;
if(countRotate == 0){
adiciona = true;
}
}
});
// I thought of something like that.
.circle{
width:200px;
height:200px;
border-radius:50%;
border
}
.circle:hover{
#circuloprincipalcomabaazulclaro{
@include animation(rotate 3s infinite alternate);
}
}
@keyframes rotate {
from{
transform: rotate(0deg);
}
to{
transform: rotate(360deg);
}
}
/* But when I remove the mouse it returns to the starting point. */
<div class="circle"></div>
我们都很好,谢谢关心。请分享您尝试过的内容并阅读[MCVE](http://stackoverflow.com/help/mcve) – philantrovert
我们需要[mcve]比任何事情都重要。 –
代码段不起作用。你需要包含jquery。 – G0dsquad