Как достигается эффект в меню?

Question

[leha78]

agrimatcokg.com

Когда на элементе меню наводишь курсор, черный бекграунд как бы следит за курсором, как это достигается?

Answer 1

[Anton Filippov]

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

Ну что там сложно, при ховере берете позицию элемента, и двигаете на него абсолютно спозиционированный, на котором висит транзишн + подгоняете ширину. При анховере возвращаете обратно. Я насчитал 8 строчечек кода.

Comments

[leha78]

спасибо)

Answer 2

[Дмитрий]

Пример
https://jsfiddle.net/soledar10/ghmjxfjp/

Comments

[#rybak]

слишком примитивный пример
а если пользователь добавит пункт меню?
нужно чтобы верстальщик снова брался за работу ?

Answer 3

[#rybak]

Вот как это делается
Вот демо
Если нужно сделать всё чётко, то одним css тут не обойтись.