这是jquery模拟IOS7顶部或者底部弹窗通知效果插件,在页面上引入jQuery,然后引入banneralert.js和banneralert.css两个文件即可调用。
选项名称 | 默认值 | 描述 |
title | 横幅的标题。 | |
icon | 横幅的图标。 | |
content | 横幅的内容。 | |
handle | true | 是否显示把手,把手的作用:点击后直接消除横幅,忽略持续时间设置。 |
addClass | 要附加到横幅元素上的class,可用于自定义样式等,多个class请用空格分隔。 | |
sound | 横幅弹出时播放的声音。 | |
position | top | 横幅的位置,包含top(顶部)和bottom(底部)两个可用的值。 |
html | false | 是否把标题和内容作为HTML添加到横幅元素上。 |
show_duration | 400 | 横幅弹出动画的持续时间(单位:毫秒)。 |
show_easing | swing | 横幅弹出动画的时间曲线,包含swing(缓动)和linear(匀速)两个可用的值。 |
duration | 3000 | 横幅停留在页面上的时间(单位:毫秒)。 |
hide_duration | 400 | 横幅收回动画的持续时间(单位:毫秒)。 |
hide_easing | swing | 横幅收回动画的时间曲线,包含swing(缓动)和linear(匀速)两个可用的值。 |
onClick | 回调函数,点击横幅时执行的脚本。 | |
onHide | 回调函数,横幅消失后执行的脚本。 |
首先,在页面上引入jQuery,然后引入banneralert.js和banneralert.css两个文件。(或压缩版banneralert.min.js)
只需要运行$("body").showbanner(选项);即可,选项说明和示例在上文已经列出。