Animate CSS3 Вращение onClick с предыдущим и следующим
-
26-12-2019 - |
Вопрос
У меня есть круг, который мне нужно преобразовать 90 деллисс, когда onClick уволен на .Next Class и -90 degress при нажатии на .prev
Мне удалось создать следующий код, основанный на том, что я мог Google себя тоже!
$('.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');
});
.
И до сих пор работает всего одним щелчком мыши!Но мне нужно, чтобы он повернул 180, если вы дважды щелкаете дважды на .ext и как 360, когда вы щелкаете 4 раза на .Prev.
Но я не могу, кажется, не могу работать, именно поэтому я сейчас обращаюсь к вам эксперты :)
Решение
Вам нужно инкрементное вращение.
Я думаю, что эта тема имеет к вам хорошие советы:
Увеличение вращения 45 градусов на щелчках W / OUTИспользование переменной
Не связан с StackOverflow