Angular / CSS - постепенное смещение подсветки кнопки к сфокусированной кнопке с помощью промежуточных кнопок выделения подсветки - PullRequest
0 голосов
/ 26 апреля 2020

Я пытаюсь добиться эффекта перехода фокуса в ряду кнопок.

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

Я пытаюсь с утра найти любой CSS или Angular подход к достижению этой цели, но я либо ищу неправильные технические термины, либо их нет.

tabindex - это способ начать, но я действительно не знаю, как Я могу перевести выделение с помощью не сфокусированных кнопок на выделенную. Обратите внимание, что количество кнопок является динамическим c и определяется при инициализации (по свойству ввода, из другого Angular компонента), поэтому я не могу ничего жестко кодировать.

Просто ради демонстрации, вот Windows Окно безопасности, которое делает то же самое, хотя и в вертикальном столбце.

enter image description here

...