input框 下面 紧跟着div弹出层,js取top left数值[实例]

来源:互联网 发布:3d室内设计软件中文版 编辑:程序博客网 时间:2024/05/01 04:51
<form><input type="text" id="searchId" onkeyup="showSearch(this)" onblur="hideSearch(this)"/></form><div style="width:300px;height:500px;border:1px solid #817F82;display:none;position: absolute;" id="showInfo"></div><script>var setSearchFlag;function showSearch(obj){clearSearchFlag();var w3c=(document.getElementById)? true:false;//w3c 标准var ns6=(w3c && (navigator.appName=="Netscape"))? true: false;//Netscape浏览器 标准的W3Cvar left,top;if (!ns6){//判断IEvar nLt = 0;var nTp = 0;var offsetParent = obj;while (offsetParent!=null && offsetParent!=document.body) {nLt += offsetParent.offsetLeft;nTp += offsetParent.offsetTop;offsetParent=offsetParent.offsetParent;}left = nLt;top = nTp + obj.offsetHeight;} else {//标准w3cleft = obj.offsetLeft -5;top = obj.offsetTop + obj.offsetHeight;}$('#showInfo').css('display','block');$('#showInfo').css('top',top);}function hideSearch(obj){setSearchFlag = setTimeout(function(){$('#showInfo').css('display','none');},100);}function clearSearchFlag(){window.clearTimeout(setSearchFlag);}</script>