把鼠標放到鏈接上看提示信息如何定制提示信息，說起來很簡單，先畫出提示信息層，然后定位到目標對象。下面把實現分三部來說明：
1）繪制信息層
有兩種方式，一種是靜態，把層的html代碼寫在文檔中，另外一種是動態，運用javascript腳本動態的創建層。靜態方式簡單，不靈活，動態的靈活，但比較困難，需要熟悉腳本和Dom結構，下面的代碼是動態方式創建提示層
function createDivTooltip（）
{
var divTips = document.createElement（'div'）；//create div element
divTips.id='tooltip'；
divTips.style.display='none'//invisible
document.body.appendChild（divTips）；
}
2）定位信息層
function locate（e）
{ e=e||window.event；
var divTips = document.getElementById（'tooltip'）；
var mousePos=getMousePosition（e）；//get the coordinate of the mouse
divTips.style.top=mousePos.top-12+"px"；
divTips.style.left=mousePos.left-8+"px"；
}關于如何定位鼠標在文檔中的位置請參考《獲取鼠標的坐標》
3）附加事件
<a href="" title="this is a test for tooltip" onmouseover="showTooltip（event）；" onmousemove="locate（event）；" onmouseout="hideTooltip（event）；">click to do something</a>上面代碼給一個鏈接添加了三個事件，onmouseover鼠標移到鏈接上的時候顯示提示信息，onmousemove鼠標在鏈接上移動的時候提示信息跟隨，onmouseout鼠標移開鏈接時隱藏提示信息，雖然上面的代碼能夠實現功能，但不是很好，因為需要為每個鏈接一一添加事件，而實際開發中一個頁面就會有很多鏈接，這樣就不方便，比較好的方法是下面代碼這樣實現
function prepare（id）
{
if（id==null） links=document.getElementsByTagName（"a"）；
else links=document.getElementById（id）。getElementsByTagName（"a"）；
for（i=0；i<links.length；i++）{
attachEvent（links[i]）；
}
}
function attachEvent（link）
{
if（！link） return；
link.attachEvent（"onmouseover"，showTooltip）；
link.attachEvent（"onmousemove"，locate）；
link.attachEvent（"onmouseout"，hideTooltip）；
}
完成上面的三部簡單的自定義提示信息就完成啦，一些特別的提示信息是對創建的層做了特殊處理，如我們經常看到圓角提示信息，是在層上添加了背景圖片。
