鼠标放上去显示全部文字，不放上去，显示部分文字jquery效果，包括隐藏部分文字
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script type="text/javascript" src="jquerys/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="jquerys/jquery-1.4.4.js"></script>
<script type="text/javascript" >
$("div.divmatnrdesc").live("mouseover", function(e) {
text=$(this).text();
tooltip = "<div id="tooltipdiv"><font style="font-size:26px"> "+text+"</font></div>";
$("body").append(tooltip);
$("#tooltipdiv").show();
$("#tooltipdiv")
.css({
"top": (e.pageY+10) + "px",
"left": (e.pageX +10) + "px"
}).show("fast");
});
$("div.divmatnrdesc").live("mouseout", function(e) {
$("#tooltipdiv").remove();
});
$("div.divmatnrdesc").live("mousemove", function(e) {
$("#tooltipdiv")
.css({
"top": (e.pageY+10 ) + "px",
"left": (e.pageX+10) + "px"
}).show();
});
</script>
<style type="text/css">
#bg .name{
color:#00CCCC;
text-align:center;
}
.divmatnrdesc{
width:100px;overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
}
</style>
<title>My JSP "view.jsp" starting page</title>
</head>
<body>
<table id="bg" width="400px" border="1" style="table-layout:fixed;">
<tr>
<td class="name" width="100px">户名</td>
<td class="name" width="100px">内容</td>
<td class="name" width="100px">时间</td>
<td class="name" width="100px">时间</td>
</tr>
<tr>
<td class="name" width="50px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">admin</td>
<td width="100px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">123</td>
<td width="100px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">2012</td>
<td width="100px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">20124</td>
</tr>
<tr>
<td width="100px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">admin</td>
<td width="100px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">233ssssssssssssssssssssssssss33fffffff</td>
<td width="100px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">2013</td>
<td width="100px" style="overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;">201sssss3</td>
</tr>
</table>
<div class="divmatnrdesc">texxxxxxxxx你好,有你就好!有你真好</div>
</body>
</html>
