Problem with transition

Hi, i have problem with transition, it just doesnt work.
I do not know what I am doing wrong

Here is codepen: https://codepen.io/fdsfsdfsgsdgsd/pen/mdmXLyv

What is it supposed to do?

#nav-mobile element should appear gradually (3s)

It’s because you’re switching between display:none and display:block.

You can use visibility instead:

#nav-mobile {
  visibility:hidden;
  ...
  opacity: 0;
  transition: opacity 3s;
}

#nav-mobile.nav--active {
  visibility:visible;
  opacity: 1;
}
1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.