- This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
Viewing 8 posts - 1 through 8 (of 8 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
.rotate{
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: transform;
overflow:hidden;
} .rotate:hover
{ -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg); }
how can we slow down the Rotation it runs very fast
Hi,
To slow down the rotation you should change the transition duration.
-webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 1s;
transition-duration: 1s;
Hope this helps :)
nothing happend result is same
Could you please provide me with the context of your problem. It would be useful if you could make a [CodePen](http://codepen.io/pen “codepen”) for me to have a look at or something similar.
It could be that there is another css rule you have not told me about that is effecting your results.
change the 200ms to a larger number 1000ms is one second
I have updated your pen here: [http://cdpn.io/mjAkh](http://cdpn.io/mjAkh “http://cdpn.io/mjAkh”)
It seems that you had some styling as I suspected in another rule. IDs take priority over classes and so your rules where not effecting it.
transition: all 200ms linear;
is shorthand for:
transition-duration: 200ms;
transition-property: all;
transition-timing-function: linear;
:)
thanx man