Jquery 3D tag cloud sample code

options

Zoom: 90 initial zoom
Min_zoom: 25
Max_zoom: 120
Zoom_factor: 2 - zoom speed of mouse wheel
Rotate_factor: -0.45 - the number of rotations of the sphere as the mouse moves. Positive Numbers are going to rotate in the opposite direction
FPS: 10 - defines the number of animation updates per second
Centrex: 250 - rotate the center horizontally in the container div
Centrey: 250 rotates the center vertically in the container div
Min_font_size: 12
Max_font_size: 32
Font_units: 'p'
Random_points: 50 - add some random points to the sphere to improve the effect
Foreground_colour: # FFF - accepts format: #333 #0A0A0A and RGB (n,n,n)
Background_colour: RGB (0,0,0) - cannot use colour names

Javascript code:

 
$('.tags').tagcloud(); 

The code in the demo is as follows:

 
$(function(){ 
$('#ts1').tagcloud({centrex:250, centrey:250, init_motion_x:10, init_motion_y:10}); 
}); 

HTML tags:

 
<div id="ts1" style="width:500px; height:500px; background-color:#000;"> 
<ul> 
<li><a href="http://www.gbin1.com/technology/html" style="color:#f00;" rel="20">HTML</a></li> 
<li><a href="http://www.gbin1.com/technology/css" rel="15">CSS</a></li> 
<li><a href="http://www.gbin1.com/technology/javascript" rel="10">Javascript</a></li> 
<li><a href="http://www.gbin1.com/technology/jquery" rel="5">jQuery</a></li> 
<li><a href="http://www.gbin1.com/technology/jquerynews" rel="1">jQuery plugin</a></li> 
<li><a href="http://www.gbin1.com/technology/jquerytutorial" rel="5">jQuery tutorial</a></li> 
<li><a href="http://www.gbin1.com/technology/jqueryhowto" rel="10">jQuery howto</a></li> 
<li><a href="http://www.gbin1.com/technology/jqueryplugins" rel="15">jQuery plugins</a></li> 
<li><a href="http://www.gbin1.com/technology/jquerymobile" style="color:#f00" rel="20">jQuery mobile</a></li> 
<li><a href="http://www.gbin1.com/technology/javautilities" rel="15">java</a></li> 
<li><a href="http://www.gbin1.com/technology/seo" rel="10">SEO</a></li> 
<li><a href="http://www.gbin1.com/technology/onlinequiz" rel="5">Quiz</a></li> 
<li><a href="http://www.gbin1.com/internet/news" rel="1">News</a></li> 
<li><a href="http://www.gbin1.com/internet/people" rel="5">People</a></li> 
<li><a href="http://www.gbin1.com/internet/mobile" rel="10">Mobile</a></li> 
<li><a href="http://www.gbin1.com/tools/photoshop" rel="15">Photoshop</a></li> 
<li><a href="http://www.gbin1.com/tools/design" style="color:#f00" rel="20">Design</a></li> 
</ul> 
</div>