一个简单精致的jQuery带箭头提示框插件

插件写好快一年了,和一个 弹出框插件(点击查看) 一起写的,一直没有整理出来,昨天得功夫整理并放到了github上,源码和网站均可在线看或下载。

CSS中的三大要素,位置、大小、可见性,在这个插件中均有体现,直接看代码吧。

示例地址  http://tianshaojie.github.io/tooltips/example.html

1.0.0

  • 位置:提示框可显示在目标元素的上下左右
  • 对齐:提示框与目标元素的对齐方式,自动调节箭头显示位置,指向目标元素中间位置
  • 支持:鼠标划过和点击显示
  • 支持:自定义高宽
  • 支持:提示框自动关闭
  • 支持:提示框失去焦点关闭
  • 支持:提示框关闭回调
  • 支持:IE6+, Firefox, Chorme

预览图

开源主页

一切尽在 https://github.com/tianshaojie/tooltips

[原]发布一个jQuery提示框插件,Github开源附主站,jquery.tooltips.js的更多相关文章

  1. jquery仿alert提示框、confirm确认对话框、prompt带输入的提示框插件[附实例演示]

    jquery仿alert提示框.confirm确认对话框.prompt带输入的提示框插件实例演示 第一步:引入所需要的jquery插件文件: http://www.angelweb.cn/Inc/eg ...

  2. 强大的响应式jQuery消息通知框和信息提示框插件

    lobibox是一款功能很强大的jQuery消息通知框和信息提示框插件.这个插件分为两个部分:消息通知框和信息提示框.它能很好的结合Bootstrap使用. 信息提示框 lobibox的信息提示框能够 ...

  3. 基于jQuery消息提示框插件Tipso

    今天要分享的这款jQuery消息提示框插件名叫Tipso,它的特点是可以定义提示框的显示位置,以及动态改变提示框的提示内容,应该说是一款相当灵活的jQuery消息提示框插件.效果图如下: 在线预览   ...

  4. 提示框插件SweetAlert

    SweetAlert可以替代Javascript原生的alert和confirm等函数呈现的弹出提示框, 它将提示框进行了美化,并且允许自定义, 支持设置提示框标题.提示类型.内容展示图片.确认取消按 ...

  5. bootstrap 弹窗或者提示框插件 bootstrap-growl 和bootstrap-notify

    Bootstrap简单好用的页面右上角咆哮提示框 - daidaineteasy的专栏 - CSDN博客https://blog.csdn.net/daidaineteasy/article/deta ...

  6. easyui toopTip,鼠标划过悬浮,显示一个小提示框的方法

    easyui toopTip,鼠标划过悬浮,显示一个小提示框的方法 /*easyui,鼠标划过悬浮,显示一个小提示框的方法*/ function toopTip(idOrClass,showText) ...

  7. Flutter Toast消息提示框插件

    Flutter Toast消息提示框插件 在开发flutter项目中,想必大家肯定会用到toast消息提示,说到这里, 大家肯定会想到https://pub.dev/ 插件库, 但是插件市场上有太多类 ...

  8. JQUERY 简单易用的提示框插件

    业务开发过程中,为了避免用户的误操作,提示框是必要的,于是琢磨出了下面这个使用,方便的提示框 还要引入遮罩层的样式如下: /*弹出层*/.input{height: 32px;border: 1px ...

  9. html提示框插件

    最近工作需要,用到各式各样的提示框,寻找了很久,发现一个的第三方的插件很好用,各种样式.接口良好.允许自定义. 官网:http://layer.layui.com/ 使用需要先引入jq1.8以上: & ...

随机推荐

  1. PowerDesigner给两个表添加reference,中间显示外键信息步骤

    如题,我用的是PowerDesigner15,其他的应该也类似. 解决方法: 右击reference,就是那条线,选中format,然后是content->center,在null,name,c ...

  2. Bzoj3524 [Poi2014]Couriers

    Description 给一个长度为n的序列a.1≤a[i]≤n. m组询问,每次询问一个区间[l,r],是否存在一个数在[l,r]中出现的次数大于(r-l+1)/2.如果存在,输出这个数,否则输出0 ...

  3. centos+nginx从零开始配置负载均衡

    nginx负载均衡的理解 nginx是一个轻量级的.高性能的webserver,他主要可以干下面两件事: 作为http服务器(和apache的效果一样) 作为反向代理服务器实现负载均衡 现在nginx ...

  4. (原)list中null的谨慎使用

    今天在刷算法题时,新建了ArrayList变量,发现ArrayList与null结合起来使用时经常出错. 请查看如下几种例子, 1.new一个ArrayList<>类型的数据, impor ...

  5. Hackerrank Going to the Office

    传送门 Problem Statement Ms.Kox enjoys her job, but she does not like to waste extra time traveling to ...

  6. AngularJs ngIf、ngSwitch、ngHide/ngShow

    在组合这些ng指令写到一篇文章里的时候,基本是有规则的,本兽会将功能相似相近的一类整合到一篇文章,方便理解和记忆. 这篇的三个指令也都是对DOM元素的操作,页面上显示/隐藏的判断,添加/移除的判断. ...

  7. HDU 1231 最大连续子序列(水题)

    题目链接: 传送门 最大连续子序列 Time Limit: 1000MS     Memory Limit: 32768 K Description 给定K个整数的序列{ N1, N2, ..., N ...

  8. phpstorm取消自动保存,修改快捷键并标识修改的文件为星星标记

    编辑时间: 2016-8-3 15:15:37 个人通过使用,发现PhpStorm的确是 编辑PHP 的神器,提供用户效率,提供智能代码补全,快速导航以及即时错误检查. 不过,让我用起来不爽的是,它会 ...

  9. PHP之:PHP编程效率的20个要点

    [导读] 用单引号代替双引号来包含字符串,这样做会更快一些.因为PHP会在双引号包围的字符串中搜寻变量,单引号则 不会,注意:只有echo能这么做,它是一种可以把多个字符串当作参数的“函数” 用单引号 ...

  10. Emmet (Zen Coding) 官方文档中HTML语法的总结

    1. 嵌套操作---------- 子操作: > div>ul>li <div> <ul> <li></li> </ul> ...