为什么那个小图片出不来
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{margin:0; padding:0px;}
#ha{ width:1190px;margin:0 auto;}
#pic{width:40px; height:40px; background:url(images/top_bg.png) no-repeat; position:absolute; left:50%; bottom:30px; margin-left:610px; display:none;}
#pic:hover{ background:url(images/top_bg.png) left -40px;}
</style>
<script type="text/javascript">
window.onload = function(){
var opic = document.getElementById("pic");
var cH = document.documentElement.clientHeight;
var timer = null;
var isTop = true;
window.onscroll= function(){
var osTop = document.documentElement.scrollTop || document.body.scrollTop;
if(osTop>=cH){
opic.style.display = "block";
}
else{
opic.style.display = "none";}
if(!isTop){
clearInterval(timer);}
isTop = false;
}
opic.onclick = function(){
timer = setInterval(function(){
var osTop = document.documentElement.scrollTop || document.body.scrollTop;
var speed = Math.floor(-osTop/5);
document.documentElement.scrollTop=document.body.scrollTop=osTop+speed;
isTop = true;
if(osTop == 0){
clearInterval(timer);}},30);
}
}
</script>
</head>
<body>
<div id="ha">
<img src="images/tb_bg.jpg">
<a href="javascript:;" id="pic"></a>
</div>
</body>
</html>