Smooth transition in javascript!!

Question

Hello guys.
Are there a way to make display = ‘none’; for <div> with smooth transition without any library like jQuery or react or used timeout or opacity = 0. ????

Answer 1

Display none can't have this effect but you can use opacity as Mirielle said and when opacity is 0 set display to none, so you don't have blank area at screen.

If I am not wrong css animation can do this no need for js.

Answer 2

From the formal definition for display in its mdn article:
"Animation type: not animatable"

So with just css either transition or animation i believe you cant.

Answer 3

Mirielle PanicS Arturop thanks