弹出框美化 alert样式美化

最新推荐文章于 2025-06-06 14:25:54 发布

原创最新推荐文章于 2025-06-06 14:25:54 发布 · 3.5w 阅读

CC 4.0 BY-SA版权

2 篇文章

订阅专栏

本文介绍了一款简易的前端提示框与弹窗组件，包括alert、confirm、toast及页面打开等功能。提供了多种样式选项如带标题、带图标等，并附带了下载链接与示例代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

引用style.css和ui.js就可以直接用以下接口调用！

alert_带标题：

mizhu.alert('alert_带标题',
'这是alert效果');

alert_带图标：

mizhu.alert('',
'这是alert效果','alert_red');

alert_带标题带图标：

mizhu.alert('alert_带标题带图标',
'这是alert效果','alert_green');

alert_无标题无图标：

mizhu.alert('',
'这是alert效果');

confirm_无标题：

mizhu.confirm('',
'是否要取消关注？',
function(flag)
 {

    if(flag)
 {

        mizhu.alert('',
'取消成功');

    }

});   

confirm_带标题：

mizhu.confirm('',
'是否要取消关注？',
function(flag)
 {

    if(flag)
 {

        mizhu.alert('温馨提醒',
'取消成功');

    }

}); 

open：

mizhu.open(600,
 400, '新浪微博',
'http://weibo.com/yuanyuanforlove');

toast_默认3秒消失：

mizhu.toast('已取消关注');

toast_自定义时间(6秒)：

mizhu.toast('已取消关注',
 6000);

下载Demo：

http://files.cnblogs.com/files/yuanxiaojian/alert.rar

本人参考了http://www.cnblogs.com/kewei/p/4423112.html 进行修改和美化，增加了一些自定义开关，后续会继续更新。