html代码：

<div><a href="#" id="doc01">最终方案01.doc</a></div>
<div><a href="#" id="doc02">最终方案01.doc</a></div>
<div><a href="#" id="doc03">最终方案01.doc</a></div>

漂浮框html代码使用jquery实现权限添加的效果

<div id="notes">
<div id="note_doc01" class="notediv">
<div class="divtop" ></div>
<div class="noteinfo" >
1 业务属性：数字营销-社区管理；文件大小：2mb
</div>
<div class="divbottom"></div>
</div>

<div id="note_doc02" class="notediv">
<div class="divtop" ></div>
<div class="noteinfo" >
2 业务属性：数字营销-社区管理；文件大小：2mb<br/>上传日期：2011-01-01；作者：admin；状态：正常<br/>文档描述：这里是项目文档这里是项目文档这里是项目文档
</div>
<div class="divbottom"></div>
</div>

<div id="note_doc03" class="notediv">
<div class="divtop" ></div>
<div class="noteinfo" >
3 业务属性：数字营销-社区管理；文件大小：2mb<br/>上传日期：2011-01-01；作者：admin；状态：正常<br/>文档描述：这里是项目文档这里是项目文档这里是项目文档
</div>
<div class="divbottom"></div>
</div>
</div>代工厂透露IPHONE5屏幕大小将缩水?

css样式：

.noteinfo{background: white;border-left: 1px solid #aeafaf;border-right: 1px solid #aeafaf; line-height: 20px;padding:2px 3px}
.notediv{position: absolute; height: auto;width: 340px;left:20px;display: none }
.divbottom{ height: 21px; background: url('../images/div_bottom.gif') no-repeat left top}
.divtop{ height: 12px; background: url('../images/div_top.gif') no-repeat left top}

jquery代码：

function showDocNote(){
var yOffset=60;
$("a[id^=doc]").each(function(){
var id = this.id;
$(this).hover(function(e){
var xOffset = $("div[id=note_"+id+"]").height();
$("div[id=note_"+id+"]").css({display:"block",top:(e.pageY - xOffset) + "px",left:(e.pageX - yOffset) + "px"});
}, function(){
$("div[id=note_"+id+"]").css("display","none");
});
});光缆宽带能接tplink吗
}

$(function(){
showDocNote();
})