overhang.js – jQuery顶部通知提示插件
分类:代码 日期: 点击(34,950) 下载(1) 来源:未知
简介
overhang.js 是一款基于 jQuery 和 jQuery UI 的用于显示通知、确认、提示的插件,它以动画的方式从顶部滑出。overhang.js 提供了众多参数,你可以自定义通知的样式,回调函数也能够满足你的更多需求。
使用方法
1、引入文件
<link rel="stylesheet" href="css/overhang.min.css"> <script src="js/jquery.min.js"></script> <script src="js/jquery-ui.min.js"></script> <script src="js/overhang.min.js"></script>
2、HTML
<a href="javascript:" class="btn1">点我</a>
3、JavaScript
$('.btn1').on('click', function() { $('body').overhang({}); });
配置
名称 | 类型 | 默认值 | 说明 |
---|---|---|---|
type | 字符串 | success | 通知的类型,可选 success / error / warn / info / prompt / confirm |
textColor | 字符串 | #FFFFFF | 文本颜色 |
message | 字符串 | This is an overhang.js message! | 通知的内容 |
duration | 整数/浮点数 | 1.5 | 通知显示的时长 |
speed | 整数 | 500 | 动画时间 |
closeConfirm | 布尔值 | false | 显示关闭按钮 |
upper | 布尔值 | false | 英文字母大写 |
easing | 字符串 | easeOutBounce | jQuery UI 的动画方式 |
html | 布尔值 | false | |
yesMessage | 字符串 | Yes | “确定”按钮的文本 |
noMessage | 字符串 | No | “取消”按钮的文本 |
yesColor | 字符串 | #2ECC71 | “确定”按钮的背景颜色 |
noColor | 字符串 | #E74C3C | “取消”按钮的背景颜色 |
callback | 函数 | 空 | 回调函数 |
当 type 为 prompt 或 confirm 时,你可以获得对应的数据,如:
alert($("target-element").data("overhangPrompt")); alert($("target-element").data("overhangConfirm"));
GitHub 地址:https://github.com/paulkr/overhang.js
标签:jQuery插件
相关文章
-
jQuery时间轴/时光轴插件jqtimeline
-
jQuery占位符插件placeMe
-
jQuery幻灯片插件anoSlide
-
jQuery幻灯片插件FlexSlider
-
jQuery内容展开折叠插件Collapse
-
jQuery Tab选项卡插件tabulous.js
-
jQuery Lightbox效果插件Boxer
-
ResizeEnd – 窗口大小调整后处理事件插件
-
jQuery图片延迟加载插件Lazy Load
-
jQuery下拉框美化插件DropKick
-
jQuery滚动到顶部插件scrollUp
-
JK Responsive – jQuery响应式lightbox插件
-
onepage-scroll – jQuery单页/全屏滚动插件
-
jQuery响应式图片画廊插件S Gallery
-
skippr – 更轻更快的jQuery幻灯片插件