[HTML] Set display:none not working. : display : none 이 동작하지 않습니다.

Hi, 

I've recreated a quick codepen of the issue I have,

there is a '.set($list, {display: 'none'})' on line 16, which is not triggering. I've been playing around one full day on that and I can't figure out what's wrong, I'm probably missing something.

So to see the first and main issue:

     - Click on the 'Show List' button

          => the list is set to display block then an animation is showing the list items and the title is disappearing,  until here all is fine.

     - Click on the 'Show Title' to re-show the title and hide the list (display:none).

         => the title is showing, the animation on list item is working, but the list isn't going from display:block to display:none. I've also tried clearProps: All (and a lot of other workarounds, in css and/or full javscript, like adding and removing class), it doesn't work either.

The second issue:

       var showList = new TimelineMax({paused: true, onComplete: console.log('complete')});

As you can see the animation is paused at first then triggered later, but the console.log is firing on page load, why? As it set to onComplete it should logically  console.log when the animation is finished.

If someone could have a quick look at this, it would be great.

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

Thanks 

Hi romain.gr,

I´m not sure what your real problem is.

Instead of "display:'none'" it is easier to set "visibility: hidden"  and tween to "autoAlpha:1".

If you want a log put where it is triggered.

To toggle the animations you can use one TimelineMax: 

[출처] https://gsap.com/community/forums/topic/16715-set-displaynone-not-working/