javascript - Animate CSS3 rotation onclick with prev and next -


i have circle need transform 90 degress when onclick fired on .next class , -90 degress when clicked on .prev

i have managed create following code based on google myself too!

 $('.next').on('click',function(e){            $('.object').animate({textindent: 90}, {             step: function(now,fx) {               $(this).css('-webkit-transform','rotate('+now+'deg)').css('-moz-transform','rotate('+now+'deg)').css('transform','rotate('+now+'deg)');             },             duration:2000           },'linear');          });          $('.prev').on('click',function(e){            $('.object').animate({textindent: 0}, {             step: function(now,fx) {               $(this).css('-webkit-transform','rotate('+now+'deg)').css('-moz-transform','rotate('+now+'deg)').css('transform','rotate('+now+'deg)');             },             duration:2000           },'linear');          }); 

and far works 1 click! need rotate 180 if click twice on .next , 360 when click 4 times on .prev.

but can't seem working, why turning experts :)

you need incremental rotation.

i think topic has tips you:

45 degree rotation increment on click w/out using variable


Comments

Popular posts from this blog

windows - Single EXE to Install Python Standalone Executable for Easy Distribution -

c# - Access objects in UserControl from MainWindow in WPF -

javascript - How to name a jQuery function to make a browser's back button work? -