泡泡提示加强版 完美支持XHTML（JavaScript）--zhuan
from :http://ayi.ck97.com/post/190.html
随着WEB标准化的进程，网站正在逐渐向XHTML过渡，在这个过程中，也慢慢发现了非常多的问题。
原先的泡泡提示组件就已经严重出现错误，经过一次大手术后，现已完全支持XHTML。
新版本实现功能：
１、完美支持XHTML，于IE和FireFox长时间测试正常
２、实现泡泡大小自适应
效果如下：
调用代码：
<script type="text/javascript" src="Js/PopBubble.js"></script>
<script type="text/javascript">
AddPopBubble('UserName','用户名兼昵称的作用，请仔细填写。用户名只能由a～z的英文字母(不区分大小写)、<br />0～9的数字、减号或下划线，以及中文组成，长度为3～20个字符，只能以数字、字<br />母或者中文开头和结尾。');
AddPopBubble('Password','密码可使用任何英文字母及阿拉伯数字组合，长度为 6-30 个字符，并区分<br />英文字母大小写。');
AddPopBubble('Password1','请再次输入您的账号密码。');
</script>
说明：AddPopBubble函数的第一个参数是绑定的控件ID，后面是泡泡提示的内容。以上代码加在<head>和</head>中间。
---注意：请将JS文件中的图片路径替换成您相应的路径，原路径为：http://reg.mpdaogou.com/ToolsPic
var pb_an=new Array();var pb_at=new Array();var pb_c1=document.all;var pb_st=new Array();function AddPopBubble(q,s){pb_an[pb_an.length]=q;pb_at[pb_at.length]=s;};function pb_f4(){for(i in pb_an){var e=document.getElementById(pb_an[i]);if(e!=null){pb_f6(e,"focus",pb_f5);pb_f6(e,"blur",pb_f2);};};};function pb_f1(r){for(i in pb_an)if(pb_an[i]==r)return pb_at[i];};function pb_f6(l,h,k){if(pb_c1){l.attachEvent("on"+h,k);}else{l.addEventListener(h,k,true);};};function pb_f5(j){var t="srcElement",p="target";var f;j[p]?f=j[p]["id"]:f=j[t]["id"];var b=document.getElementById(f);var o=document.getElementById("bubble");var c=document.getElementById("bubbleContent");c.width="";c.innerHTML=pb_f1(f);if(c.offsetWidth<150)c.width="150px";var offsetLeft=b.offsetLeft+b.offsetWidth-20;var offsetTop=b.offsetTop-c.offsetHeight-32;var a=b.offsetParent;while(a.tagName.toUpperCase()!='BODY'){offsetLeft+=a.offsetLeft;offsetTop+=a.offsetTop;a=a.offsetParent;};o.style.left=offsetLeft+"px";o.style.top=offsetTop+"px";o.style.visibility="visible";if(pb_c1)pb_f3("SELECT",o);};function pb_f3(ia,n){for(i=0;i<document.all.tags(ia).length;i++){obj=document.all.tags(ia)[i];if(!obj||!obj.offsetParent)continue;objLeft=obj.offsetLeft;objTop=obj.offsetTop;a=obj.offsetParent;while(a.tagName.toUpperCase()!='BODY'&&a.offsetParent){objLeft+=a.offsetLeft;objTop+=a.offsetTop;a=a.offsetParent;};objHeight=obj.offsetHeight;objWidth=obj.offsetWidth;if((n.offsetLeft+n.offsetWidth)<=objLeft);else if((n.offsetTop+n.offsetHeight)<=objTop);else if(n.offsetTop>=(objTop+objHeight));else if(n.offsetLeft>=(objLeft+objWidth));else{obj.style.visibility='hidden';pb_st[pb_st.length]=obj;};};};function pb_f2(){document.getElementById("bubble").style.visibility="hidden";for(i in pb_st)pb_st[i].style.visibility="visible";pb_st.length=0;};document.write('<style>.bubble-panel{position:absolute;top:0;left:0;z-index:3;visibility:hidden;}.bubble-content {text-align: left;}#bubbleContent{padding:5px;height:30px;font-size:9pt;background-color:#FFF}</style>');document.write('<div class="bubble-panel" id="bubble"><table border="0" cellpadding="0" cellspacing="0" class="bubble-content"><tr><td><img src="http://reg.mpdaogou.com/ToolsPic/bubble_01.png" width="8" height="7" alt=""></td><td colspan="2" background="http://reg.mpdaogou.com/ToolsPic/bubble_02.png"></td><td><img src="http://reg.mpdaogou.com/ToolsPic/bubble_03.png" width="8" height="7" alt=""></td></tr><tr><td width="8" background="http://reg.mpdaogou.com/ToolsPic/bubble_04.png"></td><td colspan="2" valign="top" id="bubbleContent"></td><td width="8" background="http://reg.mpdaogou.com/ToolsPic/bubble_06.png"></td></tr><tr><td colspan="3" background="http://reg.mpdaogou.com/ToolsPic/bubble_08.png"><img src="http://reg.mpdaogou.com/ToolsPic/bubble_07.png" width="34" height="25" alt=""></td><td><img src="http://reg.mpdaogou.com/ToolsPic/bubble_09.png" width="8" height="25" alt=""></td></tr></table></div>');if(!pb_c1){window.addEventListener("load",pb_f4,false);}else{window.attachEvent("onload",pb_f4);};
