jQuery提示插件jQuery.toolTip.js

所属分类:UI-工具提示

 35115  314  查看评论 (3)
分享到微信朋友圈
X
jQuery提示插件jQuery.toolTip.js ie兼容8

使用方法

页面中 导入css和js文件

<link rel="stylesheet" href="css/jQuery.toolTip.css" media="screen" />
<script type="text/javascript" src="js/jQuery.toolTip.js"></script>

在初始化页面时加载

$('.tooltip').toolTip();

在使用title属性的元素中 加入class="tooltip"

<a href="" class="tooltip" title="<img src='images/user.png'><br/> wahahaha<br/><h1>真、善、忍</h1>">

OK !


相关插件-工具提示

Metro风格的jQuery个性化消息提示插件

介绍一款Metro风格的消息提示框插件,插件是基于jQuery的,不仅拥有Metro哪种简单精巧的UI风格,而且兼容性也还不错。之前分享过一些基于jQuery和CSS3的提示框插件,比如HTML5CSS3弹出提示框,感兴趣的朋友也可以前往关注。
  工具提示
 30306  343

按首字母搜索(仿携程)

城市查找按首字母搜索(仿携程)
  工具提示
 39391  435

一款腾讯UED设计的提示插件

一款腾讯UED设计的提示插件
  工具提示
 43597  435

jquery 工具提示插件awTooltip

awTooltip是一个工具提示插件,用css和jQuery插件创建的。 它可以显示工具提示右,左,顶部或底部的元素。 也可以使用彩色工具提示样式。
  工具提示
 32515  312

讨论这个项目(3)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    dkkwhdq 0
    2017/11/7 15:00:28

    这个插件有个小问题,特意登陆评论一下。

    “当title内是纯字母或纯数字,过多且中间没有空格时,内容会超出底层的黑色方框”

    相信作者是以‘空格’来区分换行的,

    <a href="#" class="tooltip" title="Straight to your inbox  Be the first to Straight to your inbox  00000000000000000000000000000018888888888" >RSS FEED</a>
    <a href="#" class="tooltip" title="Straight to your inbox  Be the first to Straight to your inbox  aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aaaaaaaaa" >RSS FEED</a>

    现在项目中有个title需要提示纯单号的需求,所以发现了这个问题,有望作者能够尽快修复。

    其余挺好用,支持一下,不错!

    回复
    Thάnαtος 0
    2017/7/25 0:32:02

    如果能做上弹出窗体边缘与window窗口边缘的碰撞判断,那就非常完美了

        光光9000
        2019/2/4 1:33:02
        jcTitle可以解决,站内有的 ,可以进我的个人首页查看 http://www.jq22.com/jquery-info20952
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复