Как сделать такую анимцию в React.js?

Question

[mikhavital]

Здравствуйте!

Есть кнопки, по нажатию на которые, задний блок плавно должен сдвигаться на задний фон к кнопке, на которой было нажатие.
Не совсем понимаю,можно ли просто сдвигать этот DOM-элемент, например, CSS свойством left?
Если можно, то это нужно обрабатывать в хуке useEffect?


Подскажите, пожалуйста, как реализовать такую анимацию правильно?

Comments

[Данил Бабаков]

Почему бы не сделать класс "active" и при нажатии вешать его на кнопку, а этот блок сделать для "active" либо через background, либо через псевдо лемент

[mikhavital]

Данил Бабаков, он же тогда не будет "ездить" по навигации, если я правильно понял)

[Данил Бабаков]

mikhavital, например так https://codesandbox.io/s/long-rgb-qtx9hg

[mikhavital]

Данил Бабаков, спасибо, но решение уже нашлось) Интересное у вас решение, никогда так до этого не делал)

Answer 1

[mikhavital]

Вопрос решён с помощию волшебной библиотеки Framer Motion