ajax中的通知气泡徽章答案

【问题标题】：notification bubble badge in ajaxajax中的通知气泡徽章
【发布时间】：2013-06-28 05:25:27
【问题描述】：

如何在 Facebook 等 ajax 中获取通知编号徽章。不能在这里张贴图片，但我想人们知道我在说什么。就像您登录 Facebook 时，如果您有新消息，您会在搜索栏旁边的图标右上角看到一个小数字。我目前发现这段代码负责创建该号码，但我不能再进一步了。这是我找到的代码。

<span class="jewelCount" id="notificationsCountWrapper">
    <span id="notificationsCountValue">1</span>
    <i class="accessible_elem"> Notifications</i>
</span>

【问题讨论】：

我想知道该怎么做
我们无法为您提供这么多信息..请提供更多信息..无论如何你可以看看这个codebasehero.com/2011/07/jquery-notification-menu
谢谢，但我不想使用插件 :)
在这种情况下，您必须根据您的要求进行大量编码..

标签： php jquery ajax css

【解决方案1】：

你想要这样的东西吗？

如果您愿意，这里是 css & jquery 解决方案。演示http://jsfiddle.net/yeyene/DfSda/1/

在按钮内添加<span class="ballons"></span>，并替换动态计数值。

.ballons {
    float:right;
    margin:-20px 8px 0 0;
    line-height:30px;
    padding:0 10px;
    border-radius: 30px;
    border:3px solid #fff;
    border-radius: 30px;
    -moz-border-radius: 30px; 
    -webkit-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    background:red;
    color:#fff;
    text-align:center;
    -moz-box-shadow:    1px 1px 3px 3px #ccc;
    -webkit-box-shadow: 1px 1px 3px 3px #ccc;
    box-shadow:         1px 1px 3px 3px #ccc;
}

【讨论】：