timelineMax not working after resize

[AntonKeller]

This code works perfectly well but after the resize event will not render at all. Any ideas?

  // Megamenu panels animation fadein on hover
  function megamenu_fadein_panels() {
    if ( $(document).width() > 1087 ) {
      $('.menulink').hover(
        function() {
          var stagger_menuxl = new TimelineMax();
          var menu_stag_el = $(this).find('.menuxl__panel');
          stagger_menuxl.staggerFromTo(menu_stag_el, 0.9, {opacity:0}, {opacity:1}, 0.2);
        },
        function() {
          var menu_stag_el = $(this).find('.menuxl__panel');
          menu_stag_el.css("opacity",1);
        }
      )
    }
  }

  // Bind event listener
  $(window).resize(function(){
    stagger_menuxl.kill();
    megamenu_fadein_panels();
   });

   // Execute on load
   megamenu_fadein_panels();

 

[AntonKeller]

Nevermind and sorry, I found that I had to recreate the var inside the resize function

  $(window).resize(function(){
    var stagger_menuxl = new TimelineMax();
    stagger_menuxl.kill();
    megamenu_fadein_panels();
   });

 

[Jonathan]

Hello @AntonKeller and welcome to the GreenSock Forum!

 

Glad you got it working