jquery 最简单有效的底部浮动层，可随屏幕滚动始终居下。

1.前言。
   没想到jquery的animate功能这么强大，受教了。
2.直接代码。
    

	    <div id="pp_sc" style="position:absolute;z-index:9999;">
					当前页数12总数:70
		</div>
		<script >
			$(document).ready(function(){
			var temp=$(document).scrollTop();
			$(window).scroll(function (){
				var st=$(document).scrollTop();
				if($(document).scrollTop()>temp){
			        offsetTop=700+ $(document).scrollTop();
			        temp=$(document).scrollTop();
				}else{
			        offsetTop=700- $(document).scrollTop();
			        temp=$(document).scrollTop();
				}
				offsetTopStr=offsetTop+"px";
				$("#pp_sc").animate({top : offsetTopStr },{ duration:500 , queue:false });
			});
			$(window).scroll(); 
		}); 
		</script>	

3.运行效果 .
[img]
1.bmp

[/img]

评论

1 楼 nannan408 2013-12-16  

这个在精度有问题，下面贴出兼容ie的代码。

		<script >
		$(document).ready(function(){
			var temp=$(document).scrollTop();
			$(window).scroll(function (){
                var offsetTop=680+getScrollTop();
                var offsetTopStr=offsetTop+"px";
				$(".pp_bottom").animate({top : offsetTopStr },{ duration:500 , queue:false });
			});
			$(window).scroll(); 
		}); 
		function getScrollTop() {
			var scrollPos;
			if (window.pageYOffset) {
			scrollPos = window.pageYOffset; }
			else if (document.compatMode && document.compatMode != 'BackCompat')
			{ scrollPos = document.documentElement.scrollTop; }
			else if (document.body) { scrollPos = document.body.scrollTop; } 
			return scrollPos; 
	   }
		</script>