Javascript 删除隐藏类后窗口调整不起作用

我有一个使用CSS动画和velocity的介绍屏幕，带有一个setTimeout函数，可以进行淡出和addClass隐藏。同时，它还使用隐藏在SVG全屏图像上的removeClass执行fadeIn。问题是当SVG图像加载时，它不是全屏的。我相信这与SVG在运行简介的同时加载这一事实有关。调整窗口大小后，SVG将全屏显示。我不确定哪条路线是解决这个问题的最佳方式，我有一种感觉，我正在用错误的方式制作介绍动画。请帮忙！下面是代码，我还有一个

$（文档）.ready（函数（）{
$（“.intro animation.left”）
.延迟（400）
.速度（{宽度：0}，1200）；
$（“.intro animation.right”）
.延迟（1500）
.速度（{宽度：0}，1200）；
setTimeout（函数（）{
$（“.intro动画”）.fadeOut（“慢”，函数（）{
$（this.addClass（“简介隐藏”）；
});
$（“#覆盖”）.fadeIn（“慢”，函数（）{
$（this.removeClass（“intro-hidden”）；
});
},3000)
});
//绘制SVG掩码/////////////////////////////
var svg=document.querySelector（“#svg_uubg”）；
var tl=新的TimelineMax（{onUpdate:onUpdate}）；
var pt=svg.createSVGPoint（）；
var counter=document.querySelector（“计数器”）；
var比率=0.5625；
TweenMax.set（“#指令，#拨号，{xPercent:-50}”）；
tl.to（“#masker”，2，{attr:{r:2400}，ease:Power2.easeIn}）；
tl.反向（真）；
函数mouseHandler（）{
tl.reversed（！tl.reversed（））；
}
函数getPoint（evt）{
pt.x=evt.clientX；
pt.y=evt.clientY；
返回pt.matrixTransform（svg.getScreenCTM（）.inverse（））；
}
功能鼠标移动（evt）{
var newPoint=获取点（evt）；
TweenMax.set（“#dot”，{attr:{cx:newPoint.x，cy:newPoint.y}）；
TweenMax.to（“#ring，#masker”，0.88，{attr:{cx:newPoint.x，cy:newPoint.y}，ease:Power2.easeOut}）；
}
函数onUpdate（）{
var prog=（tl.progress（）*100）；
counter.textContent=prog.toFixed（）；
}
函数newSize（）{
var w=窗内宽度；
var h=窗内高度；
如果（w>h*（16/9））{
TweenMax.set（“#svg_uubg”，{attr:{width:w，height:w*ratio}）；
}否则{
TweenMax.set（“#svg_uubg”，{attr:{width:h/比率，height:h}）；
}
var data=svg.getBoundingClientRect（）；
TweenMax.set（“#svg_uubg”，{x:w/2-data.width/2}）；
TweenMax.set（“#svg_uubg”，{y:h/2-data.height/2}）；
}
window.addEventListener（“mousedown”，mouseHandler）；
window.addEventListener（“mouseup”，mouseHandler）；
window.addEventListener（“mousemove”，mousemove）；
newSize（）；
addEventListener（“调整大小”，新闻大小）
@导入url（'https://fonts.googleapis.com/css?family=Montserrat:700&display=swap');
身体{
最小高度：100vh；
背景色：#1F242D；
光标：无；
溢出：隐藏；
字体系列：“蒙特塞拉特”，无衬线；
}
.简介隐藏{
显示：无；
可见性：隐藏；
}
.intro动画{
背景色：#2d5a87；
填充：0；
高度：100vh；
溢出：隐藏；
z指数：1；
}
.intro动画。左，.intro动画。右{
底部：0；
身高：100%；
位置：绝对位置；
排名：0；
z指数：2；
}
.intro动画。左{
背景#5B6076；
右：50%；
宽度：50%；
}
.介绍动画，对吗{
背景：#66BBDE；
右：0；
宽度：50%；
}
.intro动画。intro徽标{
宽度：470px；
高度：60px；
位置：绝对位置；
顶部：0；底部：0；左侧：0；右侧：0；
保证金：自动；
z指数：3；
}
.intro动画.box{
宽度：60px；
高度：60px；
边界半径：10px；
背景#0074D9；
颜色：#fff；
字体系列：“扩展常规字体”；
字号：1.5em；
线高：60px；
文本对齐：居中；
位置：绝对位置；
左：0%；
z指数：3；
动画：test1 3s；
}
.intro动画。框：之后{
内容：“；
显示：块；
身高：90%；
宽度：1px；
背景：#fff；
位置：绝对位置；
顶部：0；右侧：-10px；底部：0；
保证金：自动；
动画：expand1 3s；
}
.intro动画.text{
高度：60px；
颜色：#fff；
左侧填充：80px；
字体系列：“扩展常规字体”；
字号：1.5em；
线高：60px；
动画：fade1 3.5s；
}
@关键帧1{
0%{高度：0；}
40%{高度：0；}
60%{高度：80%；}
}
@关键帧测试1{
0%{变换：比例（0）；左：39%；}
40%{变换：比例（1）；左：39%；}
60%{变换：比例（1）；左：39%；}
100%{左：0%；}
}
@关键帧淡入淡出1{
0%{不透明度：0；}
65%{不透明度：0；左填充：40px；}
100%{不透明度：1；左填充：80px；}
}
.svg简介{
位置：相对位置；
填充：0；
保证金：0；
宽度：100%；
最小高度：100vh；
高度：计算值（var（--vh，1vh）*100）；
溢出：隐藏；
z指数：1；
}
.loaded.intro svg{
动画名称：fadeInDown；
动画持续时间：2.5s；
动画计时功能：轻松；
}
.svg__容器{
身高：100%；
宽度：100%；
位置：相对位置；
溢出：隐藏；
}
.svg__图像{
位置：绝对位置；
排名：0；
左：0；
右：0；
底部：0；
光标：无；
}
#指示{
位置：绝对位置；
填充：12px；
顶部：1米；
背景：rgba（0,0,0,0.55）；
右：1em；
光标：无；
填充顶部：80px；
用户选择：无；
边界半径：4px；
}
#说明p{
边际上限：0；
字号：0.8em；
颜色：#FFF；
}
#拨盘{
位置：绝对位置；
排名：0；
左：50%；
}
.文本svg{
位置：绝对位置；
排名：0；
左：0；
右：0；
底部：0；
光标：无；
z指数：2；
}
.影响文本{
字号：7em；
线高：1.2；
文本转换：大写；
}

钢筋混凝土
罗比
克伦肖
A.
   setTimeout(function(){
     $(".intro-animation").fadeOut("slow", function() {
         newSize();                                    // <- Here
         $(this).addClass("intro-hidden");
     });
       $("#overlay").fadeIn("slow", function() {
           $(this).removeClass("intro-hidden");
       });
   },3000)

// initial state
newSize();
// on resize
$(window).on('resize', newSize);

// Attaching the event listener function to window's resize event
window.addEventListener("resize", newSize);

// Calling the function for the first time
newSize();