jquery简单制作悬浮导航 滚动到哪儿 定位到哪儿

demo

$(document).ready(function() {
	scr_win();
	scr_li();//初始化滚动方法
	$(".dtnav li").click(function() {
		$(window).unbind();
		$(this).addClass('active');
		$(this).siblings('li').removeClass('active');
		scr_win();
		$('body,html').animate({
				scrollTop: $("#" + $(this).attr('id').split('_')[1])[0].offsetTop - 50
			}, 500, function() {scr_li();});
	});

});
function scr_win(){//全局滚动时 导航悬浮
	$(window).scroll(function() {
		ele = $(".dtnav").parent("div")[0];
		if (ele.offsetTop - $(window).scrollTop() <= 0) {
			$(".dtnav").addClass('piaofu');
			$(".dtnav").parent("div").height($(".dtnav").height()-1);
		}else{
			$(".dtnav").removeClass('piaofu');

		};
	});
}
function scr_li(){//导航目录所要滚动到的位置
	$(window).scroll(function() {
		$(".dth2").each(function(){
			asd = this.offsetTop - $(window).scrollTop();
			if (asd <= 50){
				$("#li_"+$(this).attr('id')).addClass('active');
				$("#li_"+$(this).attr('id')).siblings('li').removeClass('active');
			}
		});
	});
}