Biểu tượng huy hiệu có tính năng Bubble Count (như iOS) trong Jquery Mobile

Question

Tôi có tiêu đề có vài biểu tượng, tôi muốn hiển thị số lượng bong bóng động trong biểu tượng như biểu tượng huy hiệu có số lượng thông báo. Làm thế nào chúng ta có thể làm trong điện thoại di động jquery? Tôi tìm kiếm trong jquery di động cho số lượng bong bóng nhưng hiện tại của nó có sẵn với listview, nhưng tôi muốn hiển thị số trong một góc trên bên phải biểu tượng như số thông báo iOS. Tìm url tham chiếu bên dưới cho biểu tượng huy hiệu cần triển khai trong điện thoại di động jquery, url: http://en.wikipedia.org/wiki/Apple_Push_Notification_Service

Answer 1

Điều này có thể được thực hiện bằng CSS.

HTML

<div class="icon"> 
    <span class="count">12</span> 
</div> 

CSS

.icon { 
    width: 50px; 
    Height: 50px; 
    background: url(/images/icon.png) 
} 

.icon .count { 
    background:#ff0000; 
    position: absolute; 
    top: -8px; 
    Right: -8px; 
    min-width:14px; 
    height: 14px; 
    color:#ffffff; 
    border-radius: 50%; 
    padding: 2px; 
    text-align: center; 
    font-size: 12px; 
} 

Bây giờ tất cả các bạn phải làm là tìm ra khi chèn số vào "bong bóng"

EDIT: "Biểu tượng" dấu chấm lớp đã bị thiếu.