评鉴通 UI （PUI）

气泡（pui.popop.js）

常规气泡

<button class="btn btn-common pone" dir="top-left" refCont="上左">上左</button>
<button class="btn btn-common pone" dir="top" refCont="上中">上中</button>
<button class="btn btn-common pone" dir="top-right" refCont="上右">上右</button>

<button class="btn btn-common pone" dir="left-top">左上</button>
<button class="btn btn-common pone" dir="left">左中</button>
<button class="btn btn-common pone" dir="left-bottom">左下</button>

<button class="btn btn-common pone" dir="right-top" actType="click">右上</button>
<button class="btn btn-common pone" dir="right" actType="click">右中</button>
<button class="btn btn-common pone" dir="right-bottom" actType="click">右下</button>

<button class="btn btn-common pone" dir="bottom-left" refCont="下左">下左</button>
<button class="btn btn-common pone" dir="bottom" refCont="下中">下中</button>
<button class="btn btn-common pone" dir="bottom-right" refCont="下右">下右</button>

$('.examplePopop .pone').popSmart({
    // 权重高低  html属性 > 插件属性 > 插件默认属性

    // dir: 'top-right',        // 显示方向，建议像上面demo一样使用html元素的dir属性
    refType: 'dom',         // 内容方式 msg（默认）、dom（外部div）、confirm（确认框）
    actType: 'hover',       // 触发方式：hover（默认）、click
    refCont: 'html里面没有refCont属性，我是插件属性'    // 气泡内容
});

外部 Div块 气泡

<div class="pop-ready" id="divPop">
    <div class="pd10 lh20 c-brown">
        <ul>
            <li>1、<span> 灯熄灭了，月亮是寂寞的眼</span></li>
            <li>2、<span> 静静看着，谁孤枕难眠，远处传来那首熟悉的歌</span></li>
            <li>3、<span> 我们都活在这个城市里面，却为何没有再见面</span></li>
        </ul>
    </div>
</div>

$('.examplePopop .pdiv').popSmart({
    actType: 'click',
    refType: 'dom',
    refCont: $("#divPop")   // 绑定元素
})

Confirm 气泡

<button class="btn btn-red bs" dir="top-left">删除</button>
            

$('.examplePopop table button').popSmart({
    actType: 'click',
    refType: 'confirm',
    refCont: '确定要删除吗？',      // confirm 内容
    yes: function(ele, ref){        // 确定后回调事件  ele: button，ref: 弹出层
        ele.closest('tr').remove();
        console.log(ele);
        console.log(ref);
    }
})