Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Slow Me

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #46179
    Junni
    Member

    .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

    #141772
    georgearnall
    Participant

    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 :)

    #141776
    Junni
    Member

    nothing happend result is same

    #141778
    georgearnall
    Participant

    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.

    #141780
    Junni
    Member
    #141782
    pixelgrid
    Participant

    change the 200ms to a larger number 1000ms is one second

    #141783
    georgearnall
    Participant

    I have updated your pen here: [http://cdpn.io/mjAkh](http://cdpn.io/mjAkhhttp://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;

    :)

    #141786
    Junni
    Member

    thanx man

Viewing 8 posts - 1 through 8 (of 8 total)
  • The forum ‘CSS’ is closed to new topics and replies.