光标放在上面时弹出窗口

【问题标题】：Pop out window when cursor is placed on it光标放在上面时弹出窗口
【发布时间】：2016-06-06 04:27:45
【问题描述】：

我有一个 html 表格，它显示来自 mysql db 的数据。

<table>
  <thead>
     <tr>
       <th>Header-1</th>
       <th>Header-2</th>
     </tr>
  </thead>
         <?php foreach($results as $key=>$row) { ?>
     <tr>
        <td><?php echo $row['Data-1'];?></td>
        <td><?php echo $row['Data-2'];?></td>
     </tr>
</table>

Data-1 和 Data-2 中的字符数更多，所以我想限制为最多 3-4 行，但是当光标放在它们上时，我想要一个显示整个数据的弹出窗口弹出窗口。如何做到这一点？

提前谢谢..

【问题讨论】：

使用 CSS（或 javascript）可能比使用 Java 幸运。

标签： java php html mysql

【解决方案1】：

我会使用overflow:hidden; CSS 属性将每一位数据设为固定长度，然后调整我前几天制作的 JSFiddle，这样当鼠标悬停时，整个单元格会展开，或者会弹出包含完整数据的弹出窗口： https://jsfiddle.net/07q6pLfj/1/

<div>
    <p>This is an element which does not change when you hover over it.</p>
        <div class="hover"><div class="popup">
        This is text which pops up when you hover
    </div>
        When you hover over this a popup shows.
</div>
$(".hover").mouseover(function() {
    $(this).children(".popup").show();
}).mouseout(function() {
    $(this).children(".popup").hide();
});
.popup {
    display:none;
    position:absolute;
        background-color: red;
    width:400px;
    height:400px;
        margin-top: 30px;
}

【讨论】：