跟随文本框的DIV

来源:互联网 发布:seo专员是做什么的 编辑:程序博客网 时间:2024/05/17 04:32

<input type=text name=t1 onfocus="popShow(this);"><br>
<input type=text name=t2 onfocus="popShow(this);"><br>
<input type=text name=t3 onfocus="popShow(this);">
<input type=text name=t4 onfocus="popShow(this);">

<div id="pop" style="position: absolute; width: 250; display: none; z-index: 99;
font-size: 13px; background: #ffff00">
</div>
<script language=javascript>
document.onclick= popHidden;
var t1Option = "<table border=0 width=100%>";
t1Option += "<tr style='cursor:hand;' onclick='usingObject.value=(this.innerText);popHidden();' onmouseover='this.style.backgroundColor=/"#99ff33/";' onmouseout='this.style.backgroundColor=/"#ffff00/";'><td>123</td></tr>";
t1Option += "<tr style='cursor:hand;' onclick='usingObject.value=(this.innerText);popHidden();' onmouseover='this.style.backgroundColor=/"#99ff33/";' onmouseout='this.style.backgroundColor=/"#ffff00/";'><td>456</td></tr>";
t1Option += "</table>";

function popShow(e)
{//显示信息
e.select();
var moneyMsg = document.all.pop;

//moneyMsg.style.background = "#FFFF00";
var opn = t1Option;
while(opn.indexOf("usingObject") >= 0)
opn = opn.replace("usingObject",e.name);
moneyMsg.innerHTML = opn;

//下面计算位置进行显示
moneyMsg.style.display = ""; //层显示
moneyMsg.style.top = e.getBoundingClientRect().top + 20 + document.body.scrollTop;//ttop + h;
moneyMsg.style.left= e.getBoundingClientRect().left + 0 + document.body.scrollLeft;//tleft + w - moneyMsg.clientWidth;
}
function popHidden()
{//隐藏信息
if(event.srcElement.tagName == "BODY")
document.all.pop.style.display = 'none';
}
</script>

原创粉丝点击