<div style="display: fixedright: 30pxbottom: 50px">火箭</div>
这样字体就会固定在距右侧50px，距底部50px处。
问题分析：
HTML中的浮动窗口，可以使用CSS的定位方式完成，同时使用这种方式来完成这个功能也是一种较为简单的方式，只需要有HTML以及CSS的知识就可以完成了。
举例如下：
在以下示例中，将演示页面左右两侧分别放置一个高度为500像素，宽度为200像素的浮动窗口。示例中使用的定位方式为：固定定位（fixed），所有它们将永远的跟随页面进行滚动。
HTML代码：
<div id="left"><p>我是左侧浮动窗口的内容</p>
</div>
<div id="right">
<p>我是右侧浮动窗口的内容</p>
</div>
CSS代码：
body{/*
* 为body标签设置背景仅仅是为了演示效果。
* 与浮动窗口本身无关。
*/
background-color: #ccc
}
#left, #right{
position: fixed
top: 100px
width: 200px
height: 500px
line-height: 500px
text-align: center
border: 1px solid #000
background-color: #FFF
}
#left{
left: 50px
}
#right{
right: 50px
}
页面初始化效果：
=========给你上传了附件，里面是源码，你去下载在悬浮框里面加上超链接就行了
*{ padding:0px margin:0px}
.box{ width:1000px background:#ccc margin:0 auto overflow:hidden}
.main{ width:770px height:2000px background:#000 float:left}
.sub{ width:220px background:#FC6 float:right}
.sub01{ width:220px height:100px background:#0CC margin-bottom:10px}
.fixed{ width:220px height:300px background:#F66 font:normal 13px/30px \5FAE\8F6F\96C5\9ED1 text-align:center top:10px}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
<html xmlns="
<head>
<meta http-equiv="Content-Type" content="text/html charset=utf-8" />
<title>悬浮框</title>
<link type="text/css" href="css/lrtk.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/js.js"></script>
</head>
<body>
<div class="box">
<div class="main"></div>
<div class="sub">
<div class="sub01"></div>
<div class="sub01"></div>
<div class="fixed">我是悬浮框</div>
</div>
</div>
</body>
</html>
$(document).ready(function(e) {
t = $('.fixed').offset().top
mh = $('.main').height()
fh = $('.fixed').height()
$(window).scroll(function(e){
s = $(document).scrollTop()
if(s > t - 10){
$('.fixed').css('position','fixed')
if(s + fh > mh){
$('.fixed').css('top',mh-s-fh+'px')
}
}else{
$('.fixed').css('position','')
}
})
})
