JavaScript - add transition between display:none and display:block

Question

I am using JavaScript to toggle notification like below. How can I add transition between display: block and display: none;

I don\'

Answer 1

Without using css3 transition, you can use js setInterval to change some css property of the div, such as:

• Change opacity from 0 to 1

• Change height from 0 to full height

• Change width from 0 to full width

Initially, you should have display: none; opacity: 0; height: 0; width: 0'

Then you have to change display: none to display: block; before you use setInterval to change other properties.

(I guess you know how to hide the div)

You can also use setTimeout(), with a trick of recursive.