Lightweight jQuery Tag Cloud Plugin - Hotag
| File Size: | 128 KB |
|---|---|
| Views Total: | 2727 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Hotag is a simple lightweight jQuery plugin that generate a tag cloud from an array of tags for presenting your popular posts. More popular tags would be bigger than less popular ones.
How to use it:
1. Load the jQuery hotag plugin after jQuery library as usual.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="src/hotag.js"></script>
2. Create a container for the tag cloud.
<div id="demo" class="container"> </div>
3. Create an array of tags with counts, URLs and names,
var tags = [
{
"counts":1,
"tag":"balabala",
"href":"https://www.jqueryscript.net"
},
{
"counts":1,
"tag":"liber"
},
{
"counts":1,
"tag":"ranking"
},
{
"counts":2,
"tag":"slash"
},
{
"counts":2,
"tag":"slide"
},
{
"counts":1,
"tag":"tag"
},
{
...
}
];
4. Initialize the plugin to generate a tag cloud.
$("#demo").hotag({
tags: tags
});
5. All the default settings.
$("#demo").hotag({
tags: [],
keyOfName: 'tag',
keyOfCounts: 'counts',
keyOfHref: 'href',
containerClass: 'hotag-container',
minFontByPercent: 100,
maxFontByPercent: 230
});
This awesome jQuery plugin is developed by Mystist. For more Advanced Usages, please check the demo page or visit the official website.











