Проблема в тотальном незнании CSS-анимаций и, наверное, CSS в целом.
display — неанимируемое свойство. Про анимирование margin, хоть оно и анимируемое, я лучше промолчу.
Не понял задачи, страшно смотреть другое, но попробуйте анимировать opacity, если вам нужно визуально скрыть что-то изначально без изменения габаритов.
Ну и да… посмотрите, что за :active и при каких условиях этот псевдокласс активируется. Есть лютое сомнение, что вы его путаете с :hover.
Ddeeeennn, ну тогда стоило бы и сразу написать тот JS-код, который это всё ваяет в DOM, не находите?
Иначе местные друзья-эксперты даже гадать не станут, каким неэффективным способом у вас происходит обновление DOM. И CSS тоже стоит выложить, потому что если сложный CSS и т. п. — он может вызвать лютые repaint'ы, что снижает производительность рендеринга и общего отклика страницы.
Не думаю, что вам тут поможет метки С и С++, если, конечно, у вас на нём backend не сделан (тут я не берусь ничего утверждать, возможно ли это и так ли это на самом у вас деле). Но метка HTML тут явно ни при чем.
А так — это целая задача, потому как надо понять, как грузит данные, какая база данных, как оттуда данные тянутся, как JS принимает и строит DOM на основе этих данных, как это можно оптимизировать и т. д. и т. п. — наверное, смело можно идти на биржу фриланса. А тем паче с таким количеством вводных данных.