转载“精简版”滚动到顶部和底部的jQuery效果

原文链接地址：“精简版”滚动到顶部和底部的jQuery效果

滚动到顶部和底部的jQuery效果也是一个在blog中很常见的jQuery效果。
之前一直用的是西门的《缓冲版”返回顶部”》，当然现在还在继续用，觉得蛮好的，昨天看了一些jQuery的资料，浏览了一些国外jQuery代码网站，于是自己修改了一个”精简版”滚动到顶部和底部的jQuery（折腾玩玩..）。

代码

.nav_up{
padding:7px;
background-color:white;
border:1px solid #CCC;
position:fixed;
background:transparent url(../images/arrow_up.png) no-repeat top left;
background-position:50% 50%;
width:8px;
height:20px;
bottom:10px;
opacity:0.7;
left:4px;
white-space:nowrap;
cursor: pointer;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:3px;
-khtml-border-top-left-radius:3px;
-khtml-border-top-right-radius:3px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.nav_down{
padding:7px;
background-color:white;
border:1px solid #CCC;
position:fixed;
background:transparent url(../images/arrow_down.png) no-repeat top left;
background-position:50% 50%;
width:8px;
height:20px;
bottom:10px;
opacity:0.7;
left:25px;
white-space:nowrap;
cursor: pointer;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-top-left-radius:3px;
-webkit-border-top-right-radius:3px;
-khtml-border-top-left-radius:3px;
-khtml-border-top-right-radius:3px;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}

最后再在footer.php里面加上:


加在</body>之前。

好了，就这样。效果如本站左下角: