HTML5中的Web Notification桌面上右下角通告作用的完

日期:2020-10-10 类型:科技新闻 

关键词:如何制作微信小程序,微信小程序源码,小程序码生成,凡科网微信小程序,微信公众号小程序

html5桌面上通告(Web Notifications)针对必须完成在新信息入线时,有桌面上通告实际效果的状况下十分有效,在此简易详细介绍1下这个html5的新特性。根据Web Notifications(桌面上通告系统软件),网站能够在客户桌面上弹出1条通告,不管客户是不是访问当今网页页面,乃至最少化了访问器,通告都可抵达客户桌面上。

<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF⑻">
        <title></title>
    </head>
    <body>
        <script src="http://code.jquery.com/jquery⑴.8.0.min.js"></script>
        <a onclick="showNotification();">点我看右下角信息内容</a>

        <script>
            function showNotification() {
                window.Notification.permission = "granted";
                alert(window.Notification.permission);
                if(window.Notification) {
                    if(window.Notification.permission == "granted") {
                        var notification = new Notification('你有1条新信息内容', {
                            body: "你好我是王小婷",

                            icon: "img/1.jpg"
                        });
                        setTimeout(function() { notification.close(); }, 5000);
                    } else {
                        window.Notification.requestPermission();
                    }
                } else alert('你的访问器不适用此信息提醒作用,请应用chrome核心的访问器!');
            };
        </script>
    </body>
</html>

完成实际效果:

总结

以上所述是网编给大伙儿详细介绍的HTML5中的Web Notification桌面上右下角通告作用的完成,期待对大伙儿有一定的协助,假如大伙儿有任何疑惑请给我留言,网编会立即回应大伙儿的。在此也十分谢谢大伙儿对脚本制作之家网站的适用!