AlexaShemetova, ну тогда, коли вы такой умный человек, вот вам наводка.
При наведении на элемент получаете его индекс, в зависимости от его индекса меняете ширину элемета общей полоски (длинная полоска). Плюс, вам нужно подобрать тайминг верно, чтобы полоски-элеметы, соединяющие общую полоску и отдельные элементы, начинали заполняться в момент финальной стадии заполнения шага общей полоски.
Benderm, ну вот вам и ответ, собственно. Либо изначально генерируется весь набор вариантов, либо, по параметру генерируется и отдается нужный по запросу. И отправляется клиенту.