Jquery插件学习系列-QTip

Qtip是一款Jquery提示插件，该提示插件可以显示文字，图片，也可以动态的加载文字和图片，该插件网址：点击打开链接；该免费插件在使用时需要先导入Jquery插件，然后再导入Qtip插件。

(我将该网站在上面提供的Demo自己实验了一遍，感觉很好用，我将就着用他们提供的例子。)

1、使用实例（文字提示）：

<script type="text/javascript">// Create the tooltips only on document load$(document).ready(function() { // Match all link elements with href attributes within the content div $('#content a[href]').qtip( { content: 'Some basic content for the tooltip' // Give it some content, in this case a simple string });});</script>

上面是官网给出的一段代码，我实验了一把感觉很好用我在把页面的代码贴出来：

<body><div id="content"><a href="#">我是要被提示的部分</a></div></body>

当然div标签可以被任意的替换

2、带图片的提示：

官方代码：

<script type="text/javascript">
// Create the tooltips only on document load
$(document).ready(function() 
{
   // By suppling no content attribute, the library uses each elements title attribute by default
   $('#content a[href]').qtip({
      // Simply use an HTML img tag within the HTML string
      content: '<img src="/projects/qtip/images/owl_small.png" alt="Owl" />'
   });
});
</script>

再附上一些我补充的代码：

<body><div id="content"><a href="#">我是要被提示的部分我的提示是图片</a></div></body>