qTip 基于JQuery的Tooltip插件[兼容性好]_jquery
程序员文章站
2022-05-18 13:11:22
...
主页:http://craigsworks.com/projects/qtip/
下载:http://craigsworks.com/projects/qtip/download
示例:http://craigsworks.com/projects/qtip/
qTip是一个基于JQuery的Tooltip插件。它几乎支持所有的主流浏览器例如:
Internet Explorer 6.0+
Firefox 2.0+
Opera 9.0+
Safari 3.0+
Google Chrome 1.0+
Konqueror 3.5+
使用qTip可以很轻松的定义tip的位置以及样式,同时qTip还有一个强大的API......
使用qTip前,只需引入两个JS文件即可:
复制代码 代码如下:
下面举几个比较简单的例子。
1、Basic text
html如下所示:
复制代码 代码如下:
JS代码:
复制代码 代码如下:
2、Title attribute
html如下所示:
复制代码 代码如下:
JS代码:
复制代码 代码如下:
3、Image
html如下所示:
复制代码 代码如下:
JS代码:
复制代码 代码如下:
4、Corner values
html如下所示:
复制代码 代码如下:
JS代码:
复制代码 代码如下:
5、Fixed tooltips
html如下所示:
复制代码 代码如下:
JS代码:
复制代码 代码如下:
css代码:
复制代码 代码如下:
6、Loading html
html如下所示:
Html代码
复制代码 代码如下:
JS代码:
复制代码 代码如下:
7、Modal tooltips
html如下所示:
Html代码
复制代码 代码如下:
JS代码:
复制代码 代码如下:
推荐阅读