ajax中的通知泡沫徽章

时间:2013-06-28 05:25:28

标签: php jquery ajax css3

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

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

1 个答案:

答案 0 :(得分:2)

你想要这样的东西吗?

这是css&amp; jquery解决方案,如果你喜欢。 DEMO 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;
}