java - 当光标放在窗口上时弹出窗口

Question

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

<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 行，但是当光标放在它们上时，我想要一个弹出窗口，显示其中的全部数据弹出窗口。这怎么办？

提前致谢..

Answer 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;
}