d-toast实现chrome浏览器右侧底部弹出通知消息效果代码-html代码-BFW代码库

d-toast实现chrome浏览器右侧底部弹出通知消息效果代码

代码语言：html

所属分类：弹出层

代码描述：d-toast实现chrome浏览器右侧底部弹出通知消息效果代码，可以直接调用chrome内置Notification进行消息弹出，还有一种在html页面中新增dom元素模仿chrome弹出自定义通知栏。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/d-toast.min.js"></script>
</head>

<body style="height:3000px;">
    <button type="button" onclick="test(1)">桌面通知无图片</button>
    <button type="button" onclick="test(2,true)">桌面通知有图片</button>
    <button type="button" onclick="testInner(3)">仿桌面通知无图片</button>
    <button type="button" onclick="testInner(4,true)">仿桌面通知有图片</button>


<script type="text/javascript">
    function test(i, isShowIcon) {

        //需允许浏览器通知

        var config = {
            title: "新消息" + i,//通知标题部分
            body: "新消息内容" + i,//通知内容部分
            data: "abc2",// 是浏览器仿桌面通知 否首选桌面通知 默认否 可选
            onclick: function (data) {//监听点击通知   data:可传递参数 可选
                alert("仿桌面通知被点击了");
            }
        }
        if (isShowI.........完整代码请登录后点击上方下载按钮下载查看