开发环境
Drawer 在 弹出层 UI 上带来不一样的体验.

## 显示代码

    								 并

抽屉

## 显示代码

    								layui.use(['drawer'], function() {
    									var drawer = layui.drawer;

    								    drawer.open({
    								        direction: "right",
    								        dom: ".layer-top",
    								        distance: "30%"
    								    });
    								})

进阶

## 显示代码

    								var dom;

    								$(".drawer-close-mask").click(function() {
    								    dom = drawer.open({
    								        direction: "right",
    								        dom: ".layer-close-mask",
    								        distance: "30%",
    								        maskClose: false
    								    });
    								})

    								$("#btnClose").click(function() {
    								    dom.close();
    								})

扩展

## 显示代码

    								layui.use(['drawer'], function() {
    									var drawer = layui.drawer;

    								    $(".drawer-auto-close").click(function() {
    								        dom = drawer.open({
    								            direction: "right",
    								            dom: ".layer-auto-close",
    								            distance: "30%",
    								            maskClose: false,
    								            time: 1000
    								        });
    								    })
    								})

扩展

## 显示代码

    								layui.use(['drawer'], function() {
    									var drawer = layui.drawer;

    								    $(".drawer-auto-close").click(function() {
    								        dom = drawer.open({
    								            direction: "right",
    								            dom: ".layer-auto-close",
    								            distance: "30%",
    								            success:function(){
    								                layer.msg("触发回调函数")；
    								            }
    								        });
    								    })
    								})

### 左侧弹层内容...

### 右侧弹层内容...

### 上侧弹层内容...

### 下侧弹层内容...

### 点击右侧灰色区域

### 打开 2秒 后自动关闭...