blear.ui.popover

1Introduction

2Example

var Popover = require('blear.ui.popover');

var popover = new Popover();

3Static

3.1.defaults

  • 类型：Object
  • 说明：默认配置

3.2.defaults.el

  • 类型：Element | String
  • 说明：将要箭头弹出的元素，可以为空

3.3.defaults.arrow

  • 类型：Boolean
  • 说明：是否显示箭头，箭头位置会自动计算
  • 默认：true

3.4.defaults.align

  • 类型：String
  • 说明：对齐方式，可选 center、side
  • 默认："center"
center:
       [=====]
[=========^=========]

side:
       [=====]
      [===^===============]

3.5.defaults.offsetLeft

  • 类型：Number
  • 说明：左偏移
  • 默认：0

3.6.defaults.offsetTop

  • 类型：Number
  • 说明：上偏移
  • 默认：0

3.7.defaults.width

  • 类型：Number
  • 说明：弹出泡宽度
  • 默认："auto"

3.8.defaults.height

  • 类型：Number
  • 说明：弹出泡高度
  • 默认："auto"

3.9.defaults.addClass

  • 类型：String
  • 说明：附加的 class
  • 默认：""

3.10.defaults.openAnimation

  • 类型：Function
  • 说明：打开动画
  • 默认：
    function openAnimation(to, done) {
  var el = this.getPopoverEl();
  attribute.style(el, to);
  done();
}

3.11.defaults.closeAnimation

  • 类型：Function
  • 说明：关闭动画
  • 默认：
    function closeAnimation(to, done) {
  var el = this.getPopoverEl();
  attribute.style(el, to);
  done();
}

4new Popover(options)

实例化一个弹出泡。

5Prototype

5.1#getPopoverEl(): el

获取弹出泡元素。

5.1.1el

  • 类型：HTMLDIVElement
  • 说明：弹出泡元素

5.2#getContentEl(): el

获取弹出泡的内容元素。

5.2.1el

  • 类型：HTMLDIVElement
  • 说明：弹出泡的内容元素

5.3#setHTML(html): this

设置内容。

5.3.1html

  • 类型：Element | String
  • 说明：可以为元素或者 html 字符串。

5.4#open(target, [callback]): this

打开弹出泡。

5.4.1target

弹出怕对应目标，可以是元素、事件或位置对象（位置对象包含 width、height、left、top，偏移位置相对于窗口）。

5.5#close([callback]): this

关闭弹出泡。

5.6#isVisible(): visible

当前弹出泡是否可见。

5.7#destroy()

销毁实例。

6Events

6.1beforeOpen(to)

弹出泡打开之前触发，返回 false 则取消打开操作。

6.1.1to

  • 类型：Object
  • 说明：目标样式，可修改

6.2afterOpen(to)

弹出泡打开之后触发。

6.3beforeClose(to)

弹出泡关闭之前触发，返回 false 则取消关闭操作。

6.3.1to

  • 类型：Object
  • 说明：目标样式，可修改

6.4afterClose(to)

弹出泡关闭之后触发。

7Dependencies

8Reference

无。