当超出宽度时候用省略号，鼠标移动到上面时候显示所有（不用tooltip插件）

1）jquery部分

$(function()
  {
  
  $("#description").hover(function()
  {
  $(this).removeClass("description").addClass("showAll");
 
  },function()
  {
  $(this).addClass("description");
  })
  })

2）两个class类别

   table
   {
    table-layout:fixed;
   }

.description
   {
      font-size:15px;
      font-weight:normal;
width:100%;
    word-break:keep-all;/* 不换行 */
    white-space:nowrap;/* 不换行 */
    overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
    text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
   }
   /*显示在一行，也不能换行*/
   .showAll
   {
     font-size:15px;
     font-weight:normal;
width:100%;
     word-break:keep-all;/* 不换行 */
     white-space:nowrap;/* 不换行 */
     z-index:10;
    color:red;
   }

3）JSP部分，其中description内容是通过JSTL迭代出来的

 <table  class="table" style="">
         <tr bgcolor="#dddddd">
    <td>文件描述</td>
    <td>文件名</td>
    <td>操作</td>
    </tr>
  <c:forEach items="${lists}" var="list">
   <tr style="height:60px;" class="pictures">   
     <td class="description" id="description" style="">${list.description}</td> 
   </tr>
  </c:forEach>         
  </table>