UI | 输入 | 媒体 | 导航 | 其他 | 网页模板| APP模板| 常用代码| 在线代码

纯CSs文字Tooltip库Hint.css

所属分类：UI-工具提示

 27208  370  查看评论 (9)
分享到微信朋友圈
X
纯CSs文字Tooltip库Hint.css ie兼容8
 查看演示  website  立即下载

Hint.css

帮你快速实现这个tooltips提示样式

浏览器兼容

  • Chrome基本功能 + transition 效果

  • Firefox基本功能 + transition 效果

  • Opera基本功能

  • Safari basic

  • IE 10+基本功能 + transition 效果

  • IE 8 & 9 基本功能

使用方法

首先引入CSS样式表

<link href="hint.css" rel="stylesheet" />

HTML代码

通过hint-top, hint-bottom, hint-left, hint-right来改变tootips的提示方向。

而data-hint就是提示文字。

你好， <span data-hint="谢谢!">鼠标经过这里试试吧？</span>
相关插件-工具提示
查看更多

超漂亮的placeholders提示

 超漂亮的placeholders提示
  工具提示
 33476  394

jQuery网页新功能步骤引导

 在网站上经常看到的网页新功能步骤引导
  工具提示
 27525  355

仿win10侧边滑出提示框

 一款模拟win10的消息提示框toastr
  工具提示
 29749  375

jquery自动关闭消息通知插件izitoast.js

 iziToast.js是一款跨浏览器响应式消息通知插件。该消息通知插件体积小，使用简单。消息显示时带CSS3动画效果，时尚大方。
  工具提示
 38020  450

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

    李至臣 0
    2021/3/20 5:57:48
    小确幸 0
    2020/8/5 18:27:00
    哪个大佬晓得，文字特长换行怎么破？
        ?Yiu Chak0
        2020/10/10 14:32:18
        去掉white-space: nowrap; 加上宽度或者不加就换行了
    回复
    死做做Lucifer 汪 0
    2020/2/21 13:24:25
    FYY_安晓悠悠 0
    2018/5/30 10:57:23
    可以实现一次出现多个提示框吗 回复
    apxgreen 0
    2017/11/3 15:39:09

    真方便

        周明润0
        2018/6/27 16:48:37
        嗯，真好
    回复
    ??╊?????? 0
    2017/10/8 20:25:02
    _来自风平浪静的明天009 0
    2017/9/13 10:33:53
    很实用，学习了。 回复
查看更多评论
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复