tier--- 移动端弹出层插件

1,733 阅读1分钟
原文链接: github.com

简体中文

一个针对移动端的弹框

var option = {
  width: "",              // 宽度自动  
  title: "",              // 标题
  content: "",            // 内容
  shadeClose: false,      // 点击遮蔽是否关闭 可以是回调 回调名称
  btnClose: true,         // 点击按钮是否关闭
  btn:[],                 // 按钮数组
  style: {                // 自定义样式
    main: "",
    title: "",
    content: "",
    shade: "",
    btn: []
  },
  class: {                // 自定义css类
    main: "",
    title: "",
    content: "",
    shade: "",
    btn: []
  },
  render: funciton(data) {},  // 自定义渲染函数 (扩展功能, 可自定义复杂的弹框效果)
  mode: 'dark',           // 模式: dark 黑暗, one 单一
  delay: 2000,            // 延迟关闭

  // 按钮回调
  "0": function(index) {},     // 第一个按钮的回调函数
  "1": function(index) {},     // 第二个按钮的回调函数

  start: function(index) {},   // 弹出开始的回调
  end: function(index) {},     // 弹出被销毁的回调
}

var version = tier.v;

var tierId = tier.open(option);

var tierId = tier.load();

var tierId = tier.one(option);

var tierId = tier.dark(option);

tier.close(tierId);

tier.close();

  • 移动端防点击穿透
  • 弹框按钮事件防止多次调用
  • 使用 rem 布局 可开启自动
  • 防止 ios 弹出输入法时弹框也移动问题
  • 扩展功能, 可自定义复杂的弹框效果

The MIT License (opensource.org/licenses/MI…)