你好小消息

弹出层介绍

996弹出层

使用方法:(文件引入)依赖jquery

css: <link rel="stylesheet" href="/css/popup.css" type="text/css">

js: <script src="/js/popup.js"></script>

展示弹出层区

代码区

// 普通弹出层
    PopupAlert({
        width: 300,
        title: '询问',
        content: '您是如何看待产品经理？',
        BtnName: ['烦人', '奇葩'],
      }, function (res) {
        Toast('你的的观点我很认可', 1000,function () {
          Toast('弹出完的回调函数，日常可能会用到吧', 2000);
        });
      }, function (err) {
        Toast('他是史无前例的奇葩啊！！！', 1000);
    });

// 页面弹出层
    PopupHtml({
      width: 300,
      title: '询问',
      content: '<h1>如何看待产品经理？</h1><h3>现在是用h1标签问你</h3>',
    }, function (res) {

}, function (err) {
      Toast('他是史无前例的奇葩啊！！！', 1000);
    });

// Iframe弹出层
    PopupIframe({
        width: 893,
        height: 600,
        content: 'http://baidu.com/',
        title: '搜一搜看看？'
    });

// 提示框
    Toast('这是一条轻量提示框');

// loading 弹出层
    PopupLoading({
      shade: ['0.7','#fff'] //0.7透明度的白色背景;
    });

// input 层
    PopupAlert({
        width: 300,
        height: 220,
        content: '<input type="text" class="InputValue" placeholder="输入你想要获取的value值">',
        InputClass: ['.InputValue'], // 想要获取的input class名字（支持多个input，支持id选择器）
        title: '填写你需要的值'
      },function (res) {
        Toast(`以数组的方式返回${JSON.stringify(res)}`,2000);
      },function (err) {
        Toast(`取消不会获取到值`,2000);
    })

// 关闭弹出层
    ClosePopup();