CSS Section
<style type= "Text/css" >
body{
height:3000px;
}
#div1 {
height:100px;
width:100px;
Background-color: #ccc;
position:fixed;
right:0;
bottom:0;
}
</style>
HTML section
<body>
<div id= "Div1" ></div>
UL>LI{$}*50--->tab
</body>
Js-dom part
<script type= "Text/javascript" src= "Tween.js" ></script>
<script>
Window.onload=function () {
var Odiv=document.getelementbyid ("Div1");
function Move () {
if (Window.navigator.uesrAgent.indexOf ("MSIE 6")!=-1) {
var bodyscrolltop=document.documentelement.scrolltop;
var scrollbottom=document.documentelement.clientheight-odiv.offsetheight+bodyscrolltop;
odiv.style.position= "Absolute";
odiv.style.top=scrollbottom+ "px";
}
}
Move ();
Window.onscroll=window.onresize=function () {
Move ();
}
var timer=null;
Odiv.onclick=function () {
var start=document.documentelement.scrolltop| | Document.body.scrollTop;
var end=0;
var Change=end-start;
var t=0;
var endt=20;
Clearinterval (timer);
Timer=setinterval (function () {
t++;
if (T==endt) {
Clearinterval (timer);
}
Document.body.scrolltop=tween.bounce.easeout (T,start,change,endt);
Document.documentelement.scrolltop=tween.bounce.easeout (T,start,change,endt);
},30);
}
}
</script>