Posted on 2010-06-01 15:17
非洲小白臉 閱讀(438)
評論(0) 編輯 收藏 所屬分類:
tag和頁面操作
在需要顯示的目標td處:
<td onmouseover="javascript:showOpstatView('其他顯示信息')" onmouseout='javascript:opstatDivClose()'>
TR范圍內信息</td>
showOpstatView:
function showOpstatView(msg)
{
var msgStr11 = msg;
var d_dialog = document.getElementById('opdiv');
d_dialog.innerHTML = msgStr11;
d_dialog.style.position="absolute";
d_dialog.style.posLeft = document.body.scrollLeft + event.clientX + 10;
d_dialog.style.posTop = document.body.scrollTop + event.clientY;
d_dialog.style.display='';
}
上面javascript中opdiv是一個用來顯示其他信息的DIV,同時可以調整DIV顯示的位置在觸發處顯示.
<div id="opdiv" style="cursor:hand;position: absolute;background-color: #F8F8F8;border: solid 0px #ccffcc"></div>
顯示DIV的方法有了,隱藏DIV的方法如下:
function opstatDivClose()
{
var d_dialog = document.getElementById('opdiv');
if(d_dialog.style.display=='')
{d_dialog.style.display='none';}
else
{d_dialog.style.display='';}
}
這樣,就可以在鼠標移出TD范圍的時候,將DIV隱藏起來.