Javascript Gsap-on.resize问题

Javascript Gsap-on.resize问题,javascript,jquery,responsive,gsap,onresize,Javascript,Jquery,Responsive,Gsap,Onresize,我一直试图通过阅读与gsap/on.resize问题相关的其他主题来解决我的问题,但我没有找到任何正确的答案 当我打开菜单时,徽标工作正常,并将其位置设置为屏幕的中心{y:0}。但是,一旦菜单关闭,我就无法将徽标强制恢复到原始位置{y:-logosposition+20}。“菜单关闭状态”上的值未更新 我一定是搞乱了var更新,但我不知道该怎么做 希望有人能帮助我 提前感谢:) // Scope var menuFrame = $('#menu-frame'); var menuH = wi

我一直试图通过阅读与gsap/on.resize问题相关的其他主题来解决我的问题,但我没有找到任何正确的答案

当我打开菜单时,徽标工作正常,并将其位置设置为屏幕的中心{y:0}。但是,一旦菜单关闭,我就无法将徽标强制恢复到原始位置{y:-logosposition+20}。“菜单关闭状态”上的值未更新

我一定是搞乱了var更新,但我不知道该怎么做

希望有人能帮助我

提前感谢:)

// Scope

var menuFrame = $('#menu-frame');
var menuH = window.innerHeight;
var navH = $("nav").height();
var logoH = $("#logo").height();
var logoPosition = (menuH -navH)/2;
var toggleMenu = $('.menu-toggle');
var logo = $('#logo');
var logoDiv = $('#logo-divider');
var navList = $('ul#menu-nav li');


// New Gsap timeline
var menuAnim = new TimelineMax({ paused: true, reversed: true });

// Animation when toggle clicked

menuAnim.fromTo([menuFrame], 0.6, {backgroundColor : 'rgba(0, 0, 0, 0.01)'}, {backgroundColor : 'rgba(250, 250, 250, 1)', ease: Power2.easeInOut},0.1);
menuAnim.from([logo], 0.6, { y:-logoPosition +20, ease: Power2.easeInOut });
menuAnim.fromTo([logoDiv], 0.6, { width: 0}, { width: '20%', ease: Power2.easeInOut });
menuAnim.staggerFromTo(navList, 1.2, {scale:0.5, opacity:0, delay:0.5}, { scale:1, opacity:1, ease:Elastic.easeOut, force3D:true}, 0.2);


// Reverse anmiation on click

toggleMenu.on('click', function() {

    $(this).toggleClass('active');
    menuAnim.reversed() ? menuAnim.play() : menuAnim.reverse();

});

// If toggle is active logo position is middle off the frame

$(window).resize(function(){

    if ($(toggleMenu).hasClass('active')) {
        menuH = window.innerHeight;
        navH = $("nav").height();
        logoH = $("#logo").height();
        logoPosition = (menuH -navH)/2;
      var menuAnim = new TimelineMax({ paused: true, reversed: true });
        menuAnim.from([logo], 0.6, { y:0 }, {  ease: Power2.easeInOut });
        menuAnim.pause()

    }
    // If toggle is not active logo position = top of the frame 

    else {

        menuH = window.innerHeight;
        navH = $("nav").height();
        logoH = $("#logo").height();
        logoPosition = (menuH -navH)/2;
        var menuAnim = new TimelineMax({ paused: true, reversed: true });

        menuAnim.from([logo], 0.6, { y:-logoPosition +20 }, {  ease: Power2.easeInOut });
        menuAnim.pause()
    }
});