Dialog

业务组件,特有的动画效果,继承了KISSY Overlay组件

配置

包含Overlay的所有配置

trigger {String|Node}

触发节点

triggerType {Array}

弹出状态下, 触发弹出的事件, 例如:[‘click’,’focus’], 默认为[‘click’]

start {Object}

起始点样式

如:

{
    left: 600,
    top: 100,
    opacity: 0
}

end {Object}

终点样式

如:

{
    left: 100,
    top: 100,
    opacity: 1
}

tmpl {String}

模板字符串,在dialog加载完成后会调用brix的Pagelet,初始化弹窗中的内容

data {Object}

数据源,和tmpl组合使用

方法

包含 Overlay的所有方法

toggle()

切换显示隐藏

事件

包含 Overlay的所有事件

代码示例

KISSY.use("brix/gallery/dialog/", function(S, Dialog) {
    var config = {
        data:dropdown_data,
        tmpl:S.one("#tmpl_dropdown").html(),
        start:{
            left:100,
            top:600,
            opacity:0
        },
        end:{
            left:100,
            top:100,
            opacity:1
        },
        width:300,
        duration:0.3
    }
    var dialog = new Dialog(config);
    dialog.on('hide',function(){alert('hide')});
    dialog.on('show',function(){alert('show')});
    dialog.show();

    S.one('#btnShow').on('click',function(){
        dialog.show();
    });
    S.one('#btnHide').on('click',function(){
        dialog.hide();
    });
});