怎么使得鼠标经过某些文字的时候显示其详细信息
RT 类似于12306上面的查询车票页面 将鼠标停留在列车名上面会自动跳出那个列车所经过地点时间等信息。鼠标移开自动消失。也就是鼠标停留的时候自动生成一个表格然后覆盖原来表格的部分界面 相当于叠加起来一样
[解决办法]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<style type="text/css">
.button {
position: relative;
width: 100px; height: 20px;
border: #7a340a 1px solid;
background-color: #f7dfbb;
}
.menu {
position: absolute;
top: 21px; left: -1px;
width: 100px; height: 120px;
border: #ff3300 1px solid;
background-color: #ffcc33;
display:none;
}
.button:hover .menu {
display:block;
}
</style>
</head>
<body>
<div class="button">
xxxxxxxxxxxx
<div class="menu">
aaaaaaaaaaaa<br />
aaaaaaaaaaaa<br />
aaaaaaaaaaaa<br />
aaaaaaaaaaaa<br />
aaaaaaaaaaaa<br />
</div>
</div>
dddddddddddd<br />
dddddddddddd<br />
dddddddddddd<br />
dddddddddddd<br />
dddddddddddd<br />
dddddddddddd<br />
dddddddddddd<br />
dddddddddddd<br />
dddddddddddd<br />
</body>
</html>
