CSS了一个浮动导航条

绝对浏览器窗口定位positio：FIXED；

下拉后出现返回顶部按钮

图片是我们美工给做的。55*55px，中间缝隙3px。

css：

html,body {
height:100%
}
html,body,form,input,span,p,img,ul,ol,li,dl,dt,dd {
margin:0;
padding:0;
border:0
}
ul,ol {
list-style:none
}
body {
background:#fff;
font:12px/1.5 arial,sans-serif;
text-align:center;
height:3000px;
}
a {
text-decoration:none
}
a:hover {
text-decoration:underline
}

#moquu_top,#moquu_f1,#moquu_f2,#moquu_f3,#moquu_f4 {
z-index:2;
55px;
height:55px;
right:50%;
position:fixed;
cursor:pointer;
_position:absolute;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)))
}

#moquu_f1 {
top:360px;
_margin-top:360px
}
#moquu_f1 a {
background:url(../images/fbtn.png) -3px -1px;
right:0;
float:left;
55px;
height:55px;
text-indent:-9999px
}
#moquu_f1 a:hover {
background:url(../images/fbtn.png) -58px -1px
}
#moquu_f2 {
top:422px;
_margin-top:422px
}
#moquu_f2 a {
background:url(../images/fbtn.png) -3px -59px;
55px;
height:55px;
right:0;
float:left;
text-indent:-9999px
}
#moquu_f2 a:hover {
background:url(../images/fbtn.png) -58px -59px
}
#moquu_f3 {
top:484px;
_margin-top:484px
}
#moquu_f3 a {
background:url(../images/fbtn.png) -3px -117px;
55px;
height:55px;
right:0;
float:left;
text-indent:-9999px
}
#moquu_f3 a:hover {
background:url(../images/fbtn.png) -58px -117px
}
#moquu_f4 {
top:546px;
_margin-top:484px
}
#moquu_f4 a {
background:url(../images/fbtn.png) -3px -175px;
55px;
height:55px;
right:0;
float:left;
text-indent:-9999px
}
#moquu_f4 a:hover {
background:url(../images/fbtn.png) -175px -175px
}

#moquu_top {
top:608px;
_margin-top:608px;
background:url(../images/fbtn.png) -3px -231px;
55px;
height:55px
}

#moquu_top:hover {
background:url(../images/fbtn.png) -62px -231px
}
.moquu_f1,.moquu_f2 {
position:relative;
z-index:2
}
.moquu_f1 a:hover .moquu_f1h,.moquu_f2 a:hover .moquu_f2h {
display:block
}

body：

哦对了。JS两个 jquery1.5.1min&jquery