气泡式提示

此气泡式提示部件可快速部署，易于使用，帮你快速的开发出漂亮的页面。

使用方式：

１．当前页面支持DOM模型；

２．链接不但得嵌入在块级的标签中，并且具有title和href两个属性；

３．当鼠标移动经过此链接时，显示美丽的提示。

组成部分：

l 2K的javascript文件；

l 很少的css文件；

l 一张图片；

l 简单的四段html即可展示她的芳容。

我们来看看那四段吧。

１．js文件的引用

 

1  < script type = " text/javascript "  src = " BubbleTooltips.js " >< / script>

 

２．指定有效对象（区域）

我们可以把气泡式提示指定的任意区域，这些区域使用id来标识。

Code
1 <script type="text/javascript">
2 window.onload=function(){enableTooltips("content")};
3 </script>
4 
5 

３．html片段

Code
1 <span class="tooltip">
2 <span class="top">title of the link</span>
3 <b class="bottom">url of the link, max 30 chars</b>
4 </span>
5 
6 

４．Css文件

Code
 1 tooltip,.tooltip *{display:block}    /*added by javascript*/ 
 2 .tooltip{ width: 200px; color:#000; 
 3 
 4 font:lighter 11px/1.3 Arial,sans-serif;
 5 
 6             text-decoration:none;text-align:center}
 7 .tooltip span.top{padding: 30px 8px 0;
 8             background: url(bt.gif) no-repeat top}
 9 .tooltip b.bottom{padding:3px 8px 15px;color: #548912;
10             background: url(bt.gif) no-repeat bottom}
11 
12 

源码下载：点击下载

思想指导实践，实践加以应用，应用创造价值