文字に動きのあるサイトを作りたい

前提・実現したいこと

表題の通り、fvが読み込まれたとき、文字にタイピングのような動きを出したい。

発生している問題・エラーメッセージ

試したこと

動き
上記のサイトを見ながら作成しました。
少しアレンジを加え、fvが開いたら（認証したら）、文字に動きを入れるようにしたいので
if構文を使って下記のJsを書きました。文法なども見て確認したものの、エラーが出たりしてうまくいかなかったので、質問しました。

 if($(fixFv).onload = function() {

これがelse含めて、終わったら、「　）」を使って終了させる認識を持っていますが、
エラーを解消するには　elseの前に);を入れると解消されます。私の認識が間違えていますか？
それとも、ほかの部分が間違えていますか？

該当のソースコード

HTML
1<!DOCTYPE html>
2<html>
3<head>
4	<title></title>
5   <link rel="stylesheet" href="asset/css/destyle.css">
6    <link rel="stylesheet" href="asset/css/style.css">
7<script src="./asserts/js/jquery-3.6.0.min.js"></script>
8   <script src="./asserts/js/script.js"></script>
9
10</head>
11<body>
12	<section class="fv">
13		<div class="fv-inner">
14			<ul class="fv-list" id="slide_wrap">
15				<!-- <li class="fv_item"><img src="./asserts/img/fv/fv-pc (1).jpg" alt=""></li><!== /.fv-item -->
16				<!-- <li class="fv_item"><img src="./" alt=""></li>/.fv-item -->
17				<!-- <li class="fv_item"><img src="./asserts/img/fv/fv-code.png" alt=""></li>/.fv-item -->
18				<li class="fv_item"><img alt="" src="./asserts/img/fv/web%20era_natural.png"></li><!-- /.fv_item -->
19			</ul><!-- /.fv-list -->
20			<h2 class="fv-txt"></h2>
21			<p class="fv-txt1 TextTyping"><span>〇</span><span>〇</span><span>〇</span></p><span>〇</span>代<span>〇</span> <span>〇</span><span>〇</span><span>〇</span><span>〇</span><span>〇</span><span>〇</span><span>〇</span> <span>〇</span> <span>Sit〇</span> <span>〇</span> <!-- <br class="fv-txt2"> -->
22			 <!-- /.fv-txt -->
23		</div><!-- /.fv-inner -->
24	</section><!-- /.fv -->
25</body>
26</html>

CSS
1
2.fv {
3  position: relative;
4  overflow: hidden;
5  width: 100%;
6}
7
8@media screen and (min-width: 600px) and (max-width: 1024px) {
9  .fv {
10    margin-top: 0px;
11    padding: 0px 3%;
12  }
13}
14
15@media screen and (max-width: 599px) {
16  .fv {
17    margin-top: 0px;
18    padding: 0px 5%;
19  }
20}
21
22.fv-inner {
23  position: relative;
24}
25
26.fv-txt {
27  position: absolute;
28  top: 50%;
29  left: 25%;
30  -webkit-transform: translate(-40%, -40%);
31          transform: translate(-40%, -40%);
32  /* white-space: nowrap; */
33  color: lightcyan;
34  -webkit-writing-mode: vertical-rl;
35      -ms-writing-mode: tb-rl;
36          writing-mode: vertical-rl;
37  font-size: 2.5em;
38}
39
40.fv-txt span {
41  letter-spacing: 2rem;
42}
43
44.TextTyping span {
45  display: none;
46}
47
48.TextTyping::after {
49  content: "|";
50  -webkit-animation: typinganime .8s ease infinite;
51          animation: typinganime .8s ease infinite;
52}
53
54@-webkit-keyframes typinganime {
55  from {
56    opacity: 0;
57  }
58  to {
59    opacity: 1;
60  }
61}
62
63@keyframes typinganime {
64  from {
65    opacity: 0;
66  }
67  to {
68    opacity: 1;
69  }
70}

JS
1
2function TextTypingAnime() {
3  $('.TextTyping').each(function() {
4    var fix =$('.fv')
5    var fixFv =fix.offset().top
6    var thisChild = "";
7     if($(fixFv).onload = function() {
8         thisChild = $(this).children();  // spanタグを取得
9         // spanタグ1つ1つ要素の処理を追加
10         thisChild.each(function (){
11             var time = 100;
12             // 時差で表示する際のdelayを指定しその時間後にFadeIn
13             $(this).delay(time * i).fadeIn(time);
14         });
15     } else {
16      thisChild = $(this).children();
17      thisChild.each(function (i) {
18        $(this).stop(); //delay処理を止める
19        $(this).css("display", "none"); //spanタグ非表示
20      });
21    });
22 });
23 
24}