气泡式提示

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

使用方式：

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

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

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

组成部分：

l 2K 的 javascript 文件；

l 很少的 css 文件；

l 一张图片；

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

我们来看看那四段吧。

１． js 文件的引用

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

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

Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--> 1 < scripttype = " text/javascript " >
2 window.onload = function (){enableTooltips( " content " )};
3 < / script>
4
5

３．html 片段

Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--> 1 < span class ="tooltip" >
2 < span class ="top" > titleofthelink </ span >
3 < b class ="bottom" > urlofthelink,max30chars </ b >
4 </ span >
5
6

４． Css 文件

Code
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--> 1 tooltip,.tooltip* { display : block } /* addedbyjavascript */
2 .tooltip { width : 200px ; color : #000 ;
3
4 font : lighter11px/1.3Arial,sans-serif ;
5
6 text-decoration : none ; text-align : center }
7 .tooltipspan.top { padding : 30px8px0 ;
8 background : url(bt.gif)no-repeattop }
9 .tooltipb.bottom { padding : 3px8px15px ; color : #548912 ;
10 background : url(bt.gif)no-repeatbottom }
11
12

源码下载： 点击下载

气泡式提示