ページをスクロールしていった時に、ページ上部にあるグローバルナビゲーション等のナビゲーションが見えなくなったら、固定位置でついてくるナビゲーションを表示します。

デモページ

(function($){
	$(function() {
	
		var fixedNav = $('#fixedNav');	
		$(fixedNav).hide();
			
		var nv = $('#normalNav');
		var nvp = nv.outerHeight() + nv.offset().top;		

		$(function(){
			$(window).scroll(function () {
				var distanceTop = $(document).scrollTop();		
				if (distanceTop > nvp) { $(fixedNav).show('fast'); }
				if (distanceTop < nvp) { $(fixedNav).hide('fast'); }				
			});
		});
		
	});
})(jQuery);

<nav id="normalNav">
	<ul>
		<li><a href="#section01">section01</a></li>
		<li><a href="#section02">section02</a></li>
		<li><a href="#section03">section03</a></li>
		<li><a href="#section04">section04</a></li>
	</ul>
</nav>
<nav id="fixedNav">
	<ul>
		<li><a href="#section01">section01</a></li>
		<li><a href="#section02">section02</a></li>
		<li><a href="#section03">section03</a></li>
		<li><a href="#section04">section04</a></li>
	</ul>
</nav>
<section class="section" id="section01">
	<h1 class="title">section01</h1>
</section>
<section class="section" id="section02">
	<h1 class="title">section02</h1>
</section>
<section class="section" id="section03">
	<h1 class="title">section03</h1>
</section>
<section class="section" id="section04">
	<h1 class="title">section04</h1>
</section>

#normalNav {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
}
#normalNav li {
	display: inline-block;
	margin: 0 20px;
}
#normalNav a {
	color: #ff5b6b;
}
#normalNav a:hover {
	color: #5d5d5d;
}
#fixedNav {
	display: none;
	width: 130px;
	text-align: center;
	font-weight: bold;
	background-color: #ff5b6b;
	position: fixed;
	right: 30px;
	top: 60px;
	padding: 10px 0;
}
#fixedNav a {
	display: block;
	color: #ffffff;
	text-decoration: none;
	padding: 10px;
}
#fixedNav a:hover {
	text-decoration: underline;
}
.section {
	padding: 20px 25px;
	border: 1px solid #cccccc;
	background-color: #ffffff;
	width: 60%;
	height: 800px;
	margin: 50px auto 0px;
}
.section .title {
	color: #ff5b6b;
}

デモページ