在微信上关注我们
气泡式弹出层组件，本组件无需创建 HTML 结构。
插件根据元素在窗口中的位置自动判断弹出层显示位置，目前没有设置位置的选项。
<button class="am-btn am-btn-primary" data-am-popover="{content: '鄙是点击显示的 Popover'}">点击显示 Popover</button>
Tooltip 效果。
<button class="am-btn am-btn-success"
data-am-popover="{content: '鄙是点击 Hover 显示的 Popover', trigger: 'hover focus'}">
Hover 显示 Popover
</button>
在元素上添加 data-am-popover 属性并设置相关参数。上面的演示都是通过 Data API 实现的。
<button data-am-popover="{content: '想显示啥', trigger: 'hover'}">Popover
</button>
通过 $().popover(options) 方式添加元素 Popover 交互。
<button class="am-btn am-btn-danger" id="my-popover">Popover via JS</button>
$(function() {
$('#my-popover').popover({
content: 'Popover via JavaScript'
})
});
| 参数 | 类型 | 描述 |
|---|---|---|
content | string | Popover 显示的内容 |
trigger | string | 交互方式，click|hover|focus，默认为 click |
.popover(options) - 激活元素的 Popover 交互功能，options 为对象.popover('toggle') - 交替 Popover 状态.popover('open') - 显示 Popover.popover('close') - 关闭 Popover事件定义在触发 Popover 交互的元素上。
| 事件名称 | 描述 |
|---|---|
open:popover:amui | open 方法被调用是立即触发 |
close:popover:amui | close 方法被调用是立即触发 |
