Как сделать анимацию шестеренок при наведении?

Question

[TheRevan]

Как реализовать анимацю шестеренок(чтобы не так криво как сейчас было), вот здесь: web-studios2.markello.biz

Comments

[ElijahTr]

Ну, во-первых, изучить механику и сделать вывод что такой работающей зубчатой передачи не существует :)
(при таком расположении шестеренок как сейчас в конце анимации)

[TheRevan]

ElijahTr, проблема в том, что я не знаю как сделать обратную анимацию при отведении курсора

[Demian Smith]

Бро, в такой комбинации шестерёнки не будут работать. Не позорьтесь ))

[TheRevan]

Demian Smith, да мне пофиг в какой комбинации, мне важно, чтобы при наведении воспроизводилась анимация, а при отведении она также плавно возвращалась к начальному состоянию

Answer 1

[riot26]

Подумать в какую сторону они бы вращались, будь они реальные. Подумать, с какой скоростью какая из них должна вращаться и подобрать скорость, при которой зубья не будут проходить сквозь другие. Подумать, могут ли они вообще вращаться, когда последняя их замыкает.

Comments

[TheRevan]

проблема в том, что я не знаю как сделать обратную анимацию при отведении курсора

[riot26]

TheRevan, не совсем понял, но возможно поможет: https://developer.mozilla.org/ru/docs/Web/CSS/anim...

[Brake Made]

TheRevan, дайте код анимации в ту сторону в которую есть:)