当鼠标滑过时显示单元格内全部内容的问题

ywduan 2004-03-30 04:32:38

一个td内要显示的内容比较多为了排版美观
想只显示一部分比如只显示前几个字，当鼠标滑过时又弹出一个虚框显示td的全部内容鼠标离开后虚框自动关闭
请问这样的效果应该怎么实现

...全文

301 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

叮咚叮咚叮叮咚 2004-03-30

打赏
举报

用哪个好来，哈哈～～～

sfply 2004-03-30

打赏
举报

就是啊
二楼的象网易的代码，一大堆
不过有一个好处就是可以立刻显示
TITLE要停留一段时间才可

kisslan 2004-03-30

打赏
举报

用它自带的属性不好么???
<table border="1">
<tr>
<td title="aaaaaaaaaaa bbbbbbbbb ccccccccccccc">aaaaaaaaaa</td>
</tr>
</table>

多菜鸟 2004-03-30

打赏
举报

// Example:
// onMouseOver="toolTip('tool tip text here')";
// onMouseOut="toolTip()";
// -or-
// onMouseOver="toolTip('more good stuff', '#FFFF00', 'orange')";
// onMouseOut="toolTip()";
/*
MOVE this to the <body>:
<div id="toolTipLayer" style="position:absolute; visibility: hidden"></div>
<script language="JavaScript"></script>
*/
var ns4 = document.layers;
var ns6 = document.getElementById && !document.all;
var ie4 = document.all;
offsetX = 0;
offsetY = 20;
var toolTipSTYLE="";
function initToolTips()
{
if(ns4||ns6||ie4)
{
if(ns4) toolTipSTYLE = document.toolTipLayer;
else if(ns6) toolTipSTYLE = document.getElementById("toolTipLayer").style;
else if(ie4) toolTipSTYLE = document.all.toolTipLayer.style;
if(ns4) document.captureEvents(Event.MOUSEMOVE);
else
{
toolTipSTYLE.visibility = "visible";
toolTipSTYLE.display = "none";
}
document.onmousemove = moveToMouseLoc;
}
}
function toolTip(msg, fg, bg)
{
if(toolTip.arguments.length < 1) // hide
{
if(ns4) toolTipSTYLE.visibility = "hidden";
else toolTipSTYLE.display = "none";
}
else // show
{
if(!fg) fg = "#777777";
if(!bg) bg = "#FFFFFF";
var content =
'<table border="0" cellspacing="0" cellpadding="1" bgcolor="' + fg + '"><td>' +
'<table border="0" cellspacing="0" cellpadding="1" bgcolor="' + bg +
'"><td align="center"><font face="sans-serif" color="' + fg +
'" size="-2"> \;' + msg +
' \;</font></td></table></td></table>';
if(ns4)
{
toolTipSTYLE.document.write(content);
toolTipSTYLE.document.close();
toolTipSTYLE.visibility = "visible";
}
if(ns6)
{
document.getElementById("toolTipLayer").innerHTML = content;
toolTipSTYLE.display='block'
}
if(ie4)
{
document.all("toolTipLayer").innerHTML=content;
toolTipSTYLE.display='block'
}
}
}
function moveToMouseLoc(e)
{
if(ns4||ns6)
{
x = e.pageX;
y = e.pageY;
}
else
{
x = event.x + document.body.scrollLeft;
y = event.y + document.body.scrollTop;
}
toolTipSTYLE.left = x + offsetX;
toolTipSTYLE.top = y + offsetY;
return true;
}