I created a navigation menu. I'm using Bootstrap 5, but I modified the default menu snippets a little bit. The problem is when I open and close the mobile menu, there is a slight delay.

Here is my code:

https://codepen.io/dtommy79/pen/xxXYQdr

I tried to disable elements one by one to see if any of those causes the issue, but didn't.

I also tried to remove the transition from the .navbar-elements class, but it isn't causing the problem.

I also tried some of the suggestions here, but it didn't solve the issue for me.

Any help is appreciated.

CodePudding user response：

Move the padding on line 277 to a different element from the one you're showing/hiding, like a menu container inside .navbar-elements.