综合效果

一、段落文本

<style>
    .zh-text-ellipsis {
        width: 180px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
</style>

<div>君不见，黄河之水天上来</div>
<div>君不见，黄河之水天上来，奔流到海不复回。君不见，高堂明镜悲白发，朝如青丝暮成雪。</div>

<script src="http://fenxianglu.cn/vendor/jquery.min.js"></script>
<script src="http://fenxianglu.cn/vendor/layer/layer.js"></script>
<script>
    $('.zh-text-ellipsis').mouseover(function() {
        if (this.offsetWidth < this.scrollWidth) {
            layer.tips(this.innerText, this, { tips: [1, '#474751'], time: -1 });
        }
    }).mouseout(function() {
        layer.closeAll('tips');
    });
</script>

二、表格文本

<style>
    table {
        width: 350px;
        border-collapse: collapse;
    }
    table th {
        background-color: #eee;
        text-align: left;
    }
    .zh-cell-ellipsis {
        position: relative;
        height: 1px;
    }
    .zh-cell-ellipsis .zh-text {
        position: absolute;
        z-index: 2;
        left: 0;
        top: -9px;
        width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
</style>

<table border="1">
    <thead>
        <tr>
            <th>序号</th>
            <th>标题</th>
            <th width="180">描述</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>将进酒</td>
            <td>
                <div>
                    <div>君不见，黄河之水天上来</div>
                </div>
            </td>
        </tr>
        <tr>
            <td>2</td>
            <td>将进酒</td>
            <td>
                <div>
                    <div>君不见，黄河之水天上来，奔流到海不复回。君不见，高堂明镜悲白发，朝如青丝暮成雪。</div>
                </div>
            </td>
        </tr>
    </tbody>
</table>

<script src="http://fenxianglu.cn/vendor/jquery.min.js"></script>
<script src="http://fenxianglu.cn/vendor/layer/layer.js"></script>
<script>
    $('.zh-cell-ellipsis .zh-text').mouseover(function() {
        if (this.offsetWidth < this.scrollWidth) {
            layer.tips(this.innerText, this, { tips: [1, '#474751'], time: -1 });
        }
    }).mouseout(function() {
        layer.closeAll('tips');
    });
</script>