移动滚动条显示或隐藏元素事件

动态网页中比较常见的一种js事件就是滚动条事件：window.onscroll，利用该事件我们可以实现返回顶部，显示隐藏窗口等特效。

首先记录一个兼容性较好的获取滚动条离顶部距离的函数getScrollTop():

function getScrollTop(){//获取滚动条距离顶端的距离
	var scrollPos;
	if(window.pageYOffset){
		scrollPos=window.pageYOffset;    //pageYOffset 设置或返回当前页面相对于窗口显示区左上角的 Y 位置。
	}else if(document.compatMode&&document.compatMode!='BackCompat'){    
//document.compatMode用来判断当前浏览器采用的渲染方式;BackCompat：标准兼容模式关闭;CSS1Compat：标准兼容模式开启。
		scrollPos=document.documentElement.scrollTop;
	}else if(document.body){
		scrollPos=document.body.scrollTop;
	}
	return scrollPos;
}

document.body的一些常见用法：http://blog.csdn.net/lhzjj/article/details/10896315　　

下面是我在模仿制作百度搜索页面时候的一个显示本已隐藏了的盒子的函数：

function removeHidden(){
	window.onscroll=function(){
		var ypos=getScrollTop();//获取滚动条距离页面顶端距离
		var hidden=document.getElementById("hidden");
		if(ypos>100){
		hidden.style.display="block";
		}else{
			hidden.style.display="none";//使用语句：hidden.setAttribute("display","none");将会无法实现功能
		}
	}
}

　　当滚动条距离顶部100px时，有hidden这个id名的元素将会被修改display属性。需要注意的是，在修改属性时，使用

hidden.setAttribute("display","none");却是无效的。