求“微信网页版”右下角消息弹出提示的实现方法？

乌哩码嗏 2016-08-10 10:45:20

求“微信网页版”右下角消息弹出提示的实现方法？
应该是用JS实现的吧？？
注意是“微信网页版”！！！不是客户端啊

...全文

4066 5 打赏收藏转发到动态举报

写回复

用AI写文章

5 条回复

切换为时间正序

请发表友善的回复…

发表回复

天际的海浪 2017-04-12

打赏
举报

这是浏览器的桌面通知api http://www.zhangxinxu.com/wordpress/2016/07/know-html5-web-notification/

cherish_xy0328 2017-04-12

打赏
举报

请问你们说的代码如何在网页版微信里面实现呀？我找不到可以更改的地方

乌哩码嗏 2016-08-10

打赏
举报

引用 1 楼 u012418098 的回复:

自己写一个div定位在右下角,里面放几个span,p...

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<style>
    #dialog{
        width:250px;
        height:120px;
        position:absolute;
        right:0px;
        bottom:3px;
        background-color:green;
        color:white;
        text-align: center;
    }
    .hide{
        display: none;
    }
</style>
<body>
<button type="button">click</button>
<div id="dialog" class="hide" >
    <p class="title"></p>
    <p class="msg"></p>
    <p class="uname"></p>
</div>
<script src="../js/jquery.js"></script>
<script>
    function show(t,m,u){
        $(".title").html(t);
        $(".msg").html(m);
        $(".uname").html(u);

        setTimeout(function(){
            $("#dialog").addClass("hide");
        },1500);//1.5秒后隐藏
    }
    $("button").on("click",function(){
        $("#dialog").removeClass("hide");
        show("张三","信息内容","www.qq.com");
    })
</script>
</body>
</html>

引入jquery

谢谢解答，这个我会，但是这个不是我想要。我要不是那些只能在网页内提示的，是最小化浏览器后还能提示的啊！！

jio可 2016-08-10

打赏
举报

自己写一个div定位在右下角,里面放几个span,p...

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<style>
    #dialog{
        width:250px;
        height:120px;
        position:absolute;
        right:0px;
        bottom:3px;
        background-color:green;
        color:white;
        text-align: center;
    }
    .hide{
        display: none;
    }
</style>
<body>
<button type="button">click</button>
<div id="dialog" class="hide" >
    <p class="title"></p>
    <p class="msg"></p>
    <p class="uname"></p>
</div>
<script src="../js/jquery.js"></script>
<script>
    function show(t,m,u){
        $(".title").html(t);
        $(".msg").html(m);
        $(".uname").html(u);

        setTimeout(function(){
            $("#dialog").addClass("hide");
        },1500);//1.5秒后隐藏
    }
    $("button").on("click",function(){
        $("#dialog").removeClass("hide");
        show("张三","信息内容","www.qq.com");
    })
</script>
</body>
</html>

引入jquery

乌哩码嗏 2016-08-10

打赏
举报

在百度知道找到答案了，csdn这么大个论坛竟然没人知道，羞死人了下面贴出代码：


<a onclick="showNotification();">show Notification</a>
	
<script>
	function showNotification () {
		window.Notification.permission = "granted";
		alert(window.Notification.permission);
		if (window.Notification){ 
			if (window.Notification.permission == "granted") {
				var notification = new Notification('标题', {
					body: "内容",
					icon: "图标路径，若不指定默认为favicon"
				});
				setTimeout(function(){notification.close();},5000);
			} else {
				window.Notification.requestPermission();
			}    
		}else alert('你的浏览器不支持此消息提示功能，请使用chrome内核的浏览器！');
	};
</script>