下スクロールで非表示、上スクロールで遅延表示するヘッダー

Question

前提・実現したいこと

jqueryで下スクロールで非表示、上スクロールで表示するヘッダーを作ってます。
現状下記のコードで最低限の要件は満たすのですが上スクロールに対して遅延またはスクロール量を設定して発火タイミングをやや送らせたいと思ってます。

発生している問題

マウスの種類やノートPCのタッチパッドの種類によっては過敏に？上スクロール判定が起きてしまい頻繁にヘッダーが表示されてしまいます。

該当のソースコード

$(function () {
	var headerHeight = $('#site-header').outerHeight();
	var startPos = 0;
	$(window).scroll(function () {
		var currentPos = $(this).scrollTop();
		if (currentPos > startPos) {
			if ($(window).scrollTop() >= 100) {
				$('#site-header').css('top', '-' + headerHeight + 'px');
			}
		} else if (startPos > currentPos) {
			$('#site-header').css('top', 0 + 'px');
		}
		startPos = currentPos;
	});
});

#site-header{
	position: fixed;
	left: 0;
	top: 0;
	transition: 0.3s;
	width: 100%;
	height: 70px;
	// 以下省略
}

試したこと

上スクロールに対してはスクロール量を設定することはできたのですが下スクロールに対してができませんでした。
完全自作ではなくサンプルコードの寄せ集めぐらいしかできないスキルレベルですので完全に理解はできておりません。
どうぞお知恵をお借りしたく存じます。