animation - CSS3 Transform objects position without Transition applied -
i'm looking simple way take object , transform rotatey property without animating pre-set transition.
it little like:
$(this).css("-webkit-transform","rotatey(180deg)"); $(this).css("-webkit-transition","10s");
then later in code
$(this).css("-webkit-transform","rotatey(0)"); $(this).css("-webkit-transition","0");
but above doesn't quite work me due fact needs set , reset transitions animation timing.
i need solution takes object point b without fuss. cant seem find way set rotatey property without going through transition/transform prefix.
any great, in advance.
what need sounds css3 animations.
so... in case because want animation in it's finished point, code this
$(this).css("-webkit-animation", "someanimation 10s forwards");
the forwards property in css3 animation assures end point in animation permanent rendered style, animation stay in end state until unload page.
in css, have add
@-webkit-keyframes someanimation { <br /> 0% {-webkit-transform: rotatey(180deg);} <br /> 100% {-webkit-transform: rotatey(0deg);} <br /> }
this code above isn't particular class or id. it's it's own section.
here's documentation on css3 animations w3c standard
and here's article smashing mag
Comments
Post a Comment