I've create a button, and I want it to rotate 360deg on mouse hover, and rotate backwords 360deg on hover off. So far it work well, but if you go slowly towards it with the mouse, it flickers. 

Here's the short version of the code:

```css
.btn {
 display: block;
 margin: 60px auto;
 width: 250px;
 padding: 15px; 
 position: relative; 

 color: #3498db;
 font-weight: 300;
 font-size: 24px;
 text-decoration: none;

 border: 5px solid #3498db;

 transform: rotate(360deg);
 transition: all 0.5s;
 transition-timing-function: cubic-bezier(1, 0.8, 0.5, 1);
}

.btn-rotate:hover {
 transform: rotate(0deg);
 transition-delay: 0;
 transition: all 0.5s;
}
```

```html
<a href="#" class="btn btn-rotate">I am a button!</a>
```

for full code, check the codpen demo <http://codepen.io/andornagy/pen/ojBNZx>