jQuery Simple Clean Tag Cloud Plugin - tx3TagCloud

File Size: 3.87 KB
Views Total: 6088
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Simple Clean Tag Cloud Plugin - tx3TagCloud

tx3TagCloud is a simple lightweight jQuery plugin that transforms an Html unordered list into a nice clean tag cloud widget on the web page.

See also:

How to use it:

1. Include the jQuery tx3TagCloud plugin's stylesheet in the header.

<link href="tx3-tag-cloud.css" media="screen" rel="stylesheet" type="text/css">

2. Include the latest jQuery library and jQuery tx3TagCloud script in the footer so the pages load faster.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
<script type="text/javascript" src="jquery.tx3-tag-cloud.js" ></script> 

3. Wrap your tags using Html unordered list. Use data-weight attribute to specify the weight for each tag.

<ul id="tagcloud">
<li data-weight="50"><a href="#">HTML5</a></li>
<li data-weight="24"><a href="#">CSS3</a></li>
<li data-weight="28"><a href="#">Javascript</a></li>
<li data-weight="32"><a href="#">jQuery</a></li>
...
</ul>

4. Call the plugin on the Html list to initialize the tag cloud.

<script type="text/javascript">
$(document).ready(function(){
$("#tagcloud").tx3TagCloud({
multiplier: 5 // default multiplier is "1"
});
});
</script>

This awesome jQuery plugin is developed by Tuxes3. For more Advanced Usages, please check the demo page or visit the official website.