jQueryによるスライドのタイミングについて

プログラミング始めて半年未満の初心者です。
今回jQueryの修正方法をお伺いしたく失礼致します。
以下コードを実装して頂くと一目で問題箇所が見つかると思います。
【問題箇所】
homeに実装したスライドショーが以下の時、タイミングがおかしくなる。
home（正常に作動）➡link-1へ移動➡homeへ移動(スライドのタイミングがおかしくなります。。)

html(index)
1</head>
2    <body>	
3  <header></header>
4   <div id="select">
5   <ul class="menu">
6    <li class="navigation"><a href="home/home.html">home</a></li>
7    <li class="navigation"><a href="link-1/link-1.html">link-1</a></li>
8  </ul>
9</div>
10    <main id="contents">
11    <div class="pageDisplay">
12     </div>
13     </main>
14    <nav>
15    </nav>
16    <aside id="right"><a href="">Blog</a></aside>
17	<aside id="banner">
18	</aside>
19    <footer>
20    </footer>
21</body>
22```CSS(index)

@charset "utf-8";
@import url("home.css");
body {
display: grid;
margin: 0;
height:100%;
min-height: 100vh;
grid-template-rows: 130px 50px 800px 150px 200px;
grid-template-columns: 15% 70% 15%;
grid-template-areas:
"title title title"
"menu1 menu1 menu1 "
"left main right "
"banner banner banner"
"footer footer footer";
}
header{
grid-area: title;
}
#select{
grid-area: menu1;

}
main {
grid-area:main;
}
nav {
grid-area: left;
background-color:#E1DDDD;
}
#right {
grid-area: right;
background-color:#E1DDDD;
}
#banner{
grid-area: banner;
background: #111111;
}
#banner img{
padding-left:5%
}
footer {
grid-area: footer;
background: #000000;
}

#select {
font-family: 'Open Sans', sans-serif;
background-color:#3a3b3b;
text-align: center;
position:fixed;
top:130px;
left:0px;
width: 100%;
}
.menu {
position: relative;
list-style: none;
font-weight: 400;
font-size: 0;
text-transform: uppercase;
display: inline-block;
padding: 0;

}
.menu li {
font-size: 0.8rem;
display: inline-block;
position: relative;
padding: 15px 20px;
cursor: pointer;
z-index: 5;
min-width: 120px;
}
header {
height:130px;
width: 100%;
background-color:#FFFFFF;
background-size: 100%;
position:fixed;
top:0%;
left: 0%;
}

js(index)

$(function(){
//ページを表示させる箇所の設定
var $content = $('.pageDisplay');
//ボタンをクリックした時の処理
$(document).on('click', '.menu a',function(event) {
event.preventDefault();
//.menu aのhrefにあるリンク先を保存
var link = $(this).attr("href");
//リンク先が今と同じであれば遷移しない
if(link == lastpage){
return false;
}else{
$content.fadeOut(600, function() {
getPage(link);
});
//今のリンク先を保存
lastpage = link;
}

});
//初期設定
getPage("home/home.html");
var lastpage = "home/home.html";

//ページを取得してくる


```html.js(home)

#slider {
position: relative;
overflow: hidden;
width: 100% !important;
}
#slider ul {
position: relative;
margin: 0;
padding: 0;
height: 600px;
width: 99999px;
overflow: hidden;
list-style: none;
z-index: -2
}
#slider ul li {
position: relative;
display: block;
float: left;
margin: 0;
padding: 0;
width: 100vw;
height: 600px;
text-align: center;
}
#slider ul li .slide {
background-size: cover;
height: 100vh;
}

button.control_prev, button.control_next {
position: absolute;
top: 50%;
z-index: -1;
display: block;
border: none;
width: 2em;
height: 2em;
line-height: 1.9em;
background: rgba(255, 255, 255, 0.3);
color: #fff;
text-align: center;
text-decoration: none;
font-weight: 600;
font-size: 2rem;
opacity: 0.8;
cursor: pointer;
border-radius: 50%;
transform: translateY(-50%);
}
button.control_prev:focus, button.control_next:focus {
outline: none;
border: 1px rgba(255, 255, 255, 0.5) solid;
}
button.control_prev:hover, button.control_next:hover {
opacity: 1;
-webkit-transition: all 0.2s ease;
}

button.control_prev {
left: 2rem;
}

button.control_next {
right: 2rem;
}

.progress {
position: absolute;
background: rgba(255, 255, 255, 0.3);
height: .5rem;
width: 100%;
bottom: 0;
border-top: 1px rgba(0, 0, 0, 0.15) solid;
}
.progress .bar {
height: 100%;
width: 0%;
background: #fff;
}