昨天需要在项目中使用 JavaScript 的 Tooltip，在网上找了很多，但都不太好用，大多数都用到了 document.write()，而且是在 window.init 的时候对所有的 tooltips 进行初始化，当使用 AJAX 的时候，这些就不能正常工作了，所以最后决定还是自己写一个简单的基于 Prototype 的 Tooltip，以后有需要的话再增加一些功能、效果。

Requirements:
Prototype 1.5.0_rc1. You can download it from the Prototype web site.

Download:
Tooltip 0.1.0

Demo:
Click here to see online demo.

Usage:
1. Insert the following lines into section in your html file:

<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="tooltip.js"></script>

2. Define a cool css for tooltip, for example:

<style type="text/css">
#tooltip {
    background-color: #ffffcc;
    color: #000000; 
    padding: 4px; 
    border: 1px solid gray; 
    text-align: left; 
    cursor: default;
    opacity: 0.85;
    z-index: 10000;
}
</style>

3. Create a new Tooltip instance for your tooltip source html element:

<div id="mytip">Move mouse over here!</div>
 <script type="text/javascript">new Tooltip({element:"mytip", text:"Tooltip message.<br/>You can use HTML tags here."});</script>

And you can set the width of tooltip box by passing "width" parameter. For example:

new Tooltip({element:"mytip", text:"Tooltip message.<br/>You can use HTML tags here.", width:250});

Don't hesitate to comment if you have any questions.