代码改变世界

jQuery信息提示插件(jQuery Tooltip Plugin)

2011-10-23 08:34  coderidea  阅读(9215)  评论(2编辑  收藏  举报

      信息提示虽然是小东西,但是在网站设计中却起到了巨大的作用。如果你网站的信息提示做的好,会给访客留下非常深刻的印象。下面有30个非常流行的jQuery信息提示插件,希望对各位有所帮助。记住,所有的这些都是为了使网站设计更好。 :grin:

 

1. Dynamic tooltip

非常漂亮的tooltip!有渐变、透明、阴影等效果。

Dynamic tooltip

Dynamic tooltip

2. Popup Bubble

优秀的tooltip!虽然看起来简单,但是过渡效果非常棒,适用于简单干净的网站。

Popup Bubble

Popup Bubble

3. jQuery Horizontal Tooltips Menu Tutorials

精美的tooltip!提示信息不会消失,除非你点击其它链接。看起来非常简单,但是它的动画效果却非常棒。

jQuery Horizontal Tooltips Menu Tutorials

4. Prototip

多种多样的提示效果,极有效的简化工作过程。

Prototip

5. Coda Popup Bubble

非常漂亮的信息提示,有过渡效果和背景阴影。

Coda Popup Bubble

6. Awesomeness

非常酷的信息提示,平滑的过渡效果,并且有透明边框。

Awesomeness

7. TipTip

漂亮的信息提示,有淡入淡出过渡效果,幻灯、阴影特效。

TipTip

8. (mb)Tooltip

这个是为输入框开发的信息提示,过渡效果美观。

(mb)Tooltip

9. vTip

简单但是非常好的信息提示,有淡入效果。

vTip

10. jGrowl

当点击链接时淡入出现,然后固定在右上角,一段时间后自动消失,或者可以手动关闭。

jGrowl

11. jQuery Ajax Tooltip

有趣的信息提示,可以处理像小型网页图片和文字。它有一个阴影效果。

jQuery Ajax Tooltip

12. Digg-style post sharing tool with jQuery

漂亮的digg样式,适用于社交网站。

Digg-style post sharing tool with jQuery

13. Input Floating Hint Box

有趣的输入框提示,边框为圆角。输入框获得焦点时淡入,点击其它地方淡出。

Input Floating Hint Box

14. Simpletip

漂亮的提示与褪色的过渡。将鼠标悬停在链接上,tooltip淡入在链接的上方或者下方。

Simpletip

15. qTip

很简单,但 好看的提示。可以圆角,说话提示的样式。

qTip

16. Orbital Tooltip

有趣的提示插件,您可以手动设定在您需要的时间出现。

Orbital Tooltip

17. Inline HTML Tooltip

漂亮的提示,有过渡效果。

Inline HTML Tooltip

18. tipsy

tipsy

19. Easiest jQuery Tooltip Ever

Easiest jQuery Tooltip Ever

20. BsTip

BsTip

21. EZPZ Tooltip

EZPZ Tooltip

22. BeautyTips

BeautyTips

23. Tooltip

Tooltip

24. clueTip

简单的提示,当鼠标悬停在链接上时出现,直到你关闭它才会消失。

clueTip

25. Creating A Simple Tooltip Using jQuery and CSS

几个简单但是不同的提示。

Creating A Simple Tooltip Using jQuery and CSS

26. BetterTip

Tooltip出现在链接的右边。

BetterTip

27. jTip

简单但是对于登录页面非常有用。

jTip

28. jqTooltip

简单的ajax加载效果,可以淡入淡出。

jqTooltip

29. Pop!

Pop!

30. Create a Simple CSS + Javascript Tooltip with jQuery

Simple tooltip with rounded corners. It follows your mouse movements.

简单的圆角tooltip,随鼠标移动。

Create a Simple CSS + Javascript Tooltip with jQuery

 


  欢迎扫描此二维码关注web馆公众号
  作者:web馆
  出处:http://www.cnblogs.com/xiaoyao2011/
  欢迎任何形式的转载,但请务必注明出处。