CSS3 transition leaves a trail

Question

It happens sometimes with particular text, transitioning with CSS3. I do not know the reason why it happens and thus I cannot recreate the same in jsfiddle. But you can look at 4th slide (the one with 5 rings) here, http://jashwant.github.io/kickass-slider/ Cool text leaves a trail while animating and trail gets removed after sometime. But other text works okay without leaving any trail. I am not able to find out the problem. How can I avoid this trail ? (I am using latest linux chrome 26.0.1410.63) p.s. I am using jquery-transit to animate. See the `Cool` in picture. UPDATE: Here's more detailed answer

Accepted Answer

You can make the moving objects hardware-accelerated in Chrome, until the bug is fixed. Simply add the line

```
-webkit-transform: translate3d(0,0,0);
```

to the definition of your slider objects (In my test, I added it to:

```
.slider > li > .object {
```

). This fixed it for me.

CSS3 transition leaves a trail

Solution

Problem