Web development
Raiting:
6

Tinycon – a counter in favicon with JavaScript


The tinycon is a small library for the manipulating the favicon to transfer information about the new events. The browsers that do not support the canvas the counter is displayed in the title page.
image
Utilization

It is very simple in use. We need to connect lib and write
Tinycon.setBubble(6);

The library also supports options, such as a choice of color, font and positioning of the counter:
Tinycon.setOptions({
width: 7,
height: 9,
font: '10px arial',
colour: '#ffffff',
background: '#549A2F',
fallback: true
});

I would like to draw your attention to fallback setting, which is responsible for displaying the counter in the title page for the unsupported browsers.

Here are the supported browsers

Tinycon has been tested and supports the following browsers:
Chrome 15+
Firefox 9+
Opera 11+
The counter only can be displayed in the title for the following browsers:
Internet Explorer 9
Safari 5

Demo | Repository project is at gihub.
BumBum 12 april 2012, 13:37
Vote for this post
Bring it to the Main Page
 

Comments

Leave a Reply

B
I
U
S
Help
Avaible tags
  • <b>...</b>highlighting important text on the page in bold
  • <i>..</i>highlighting important text on the page in italic
  • <u>...</u>allocated with tag <u> text shownas underlined
  • <s>...</s>allocated with tag <s> text shown as strikethrough
  • <sup>...</sup>, <sub>...</sub>text in the tag <sup> appears as a superscript, <sub> - subscript
  • <blockquote>...</blockquote>For  highlight citation, use the tag <blockquote>
  • <code lang="lang">...</code>highlighting the program code (supported by bash, cpp, cs, css, xml, html, java, javascript, lisp, lua, php, perl, python, ruby, sql, scala, text)
  • <a href="http://...">...</a>link, specify the desired Internet address in the href attribute
  • <img src="http://..." alt="text" />specify the full path of image in the src attribute