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;

width: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;

width: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;

width: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;

width: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;

width: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;

width: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:

<div ></a>

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