Как создать такой ховер эффект?

Question

[lingvo838]

Подскажите что за эффекты использованы? Возможно есть готовое решение?

Comments

[Pavel Kuzyakin]

https://developer.mozilla.org/ru/docs/Web/CSS/transform

[Сергей c0re]

было же уже, причем здесь же на тостере

[lingvo838]

Сергей, удалили

[Рустам Байназаров]

lingvo838, да, я старался, сделал, но автор вопроса почему-то удалил ответ.

Answer 1

[Сергей c0re]

PS: решение не мое, найдено и сохранено :)

Comments

[Рустам Байназаров]

О, вот и мой вариант, который автор аналогичного вопроса удалил вместе с ответом. Не ожидал, что хоть кто-то оценил мои старания, LOL.

[Рустам Байназаров]

Нашёл более новый вариант, где есть правила для текущего выбранного пункта:

[lingvo838]

Рустам Байназаров, не удалял. Только зашел прочекать ответы, а вижу что админ удалил.

[Рустам Байназаров]

lingvo838, а-а-а, теперь понятно, а то было не совсем понятно.

[Сергей c0re]

lingvo838, странн...

Answer 2

[Витя Подприклопольный]

transform rotate на after
+ transition

Answer 3

[Pardon Me! Where Do I Find 4giveness?]

Примерно так:

Более гибко и точно как на картинке я бы сделал через анимации и keyframes.