how fade in a flex box?

Question

How do I get a flex box to not be part of the page until I fade it in? I used to do this with \'display: 0;\' and then use jquery .fadeIn(). But now if I set display to 0, when

Answer 1

var flex = $('#flex');

console.log(flex.css('display'));

flex.hide();

flex.velocity('fadeIn', {duration: 100, display: 'flex'});

setTimeout(function(){
  console.log(flex.css('display'));
 }, 100);

#flex{
  display: 'flex'
}