※footerの下に記述
<p id="scroll-top"><a href="#">↑<br>to top</a></p>

[css] /* return to top */
#scroll-top {
opacity: 0.6;
bottom: 20px;
padding: 10px;
position: fixed;
right: 20px;
}
#scroll-top a {
text-decoration: none;
color: #333;
}

[JavaScript]
//上に戻るボタン
$(function(){
let topBtn=$('#scroll-top'); topBtn.hide(); 　　　　　　　　 //←消えている状態から始めるための記述
$(window).scroll(function(){　　　　//windowはJavaScriptが用意している変数。scrollしたら動くfunctionの記述。
//console.log($(this).scrollTop)　　 //今どのくらいスクロールされているかをconsoleに表示する。
if($(this).scrollTop() > 300 ){　　　 　//300の位置までスクロールされたら、
topBtn.fadeIn(); 　　　　　　　　　 //フェードインする。
}
else{topBtn.fadeOut(); 　　　　　　 //それ以外の場合は、フェードアウト。
}
topBtn.on("click",function(event){
event.preventDefault(); 　　//<a>ページ内リンクの元々設定されている挙動をキャンセルする。（evevt）は自分で設定できる。
$('body,html').stop().animate({ 　　//「animate→srcrollTopの後、scrollできなくなる」→.stop()を追記で解決。
scrollTop:0
},500);
});
});
});