ArticleDirectory
- Related options
- JavaScript code:
- HTML Tag:
You may have seen the tag cloud implemented by flash. Many websites use the tag cloud built by flash, including the related Tag Cloud plug-ins in WordPress. Today, we will introduce a tag cloud plug-in developed by jquery: 3D tag cloud. I hope you will like it!
Related options
- Zoom: 90 initial Scaling
- Min_zoom: 25
- Max_zoom: 120
- Zoom_factor: 2-zoom speed of the scroll wheel
- Rotate_factor:-0.45-Number of Sphere rotations when the mouse moves. Positive will be rotated in reverse order
- FPS: 10-defines the number of animation updates per second
- Centrex: 250-horizontal rotation center in container Div
- Centrey: 250 vertical rotation center in container Div
- Min_font_size: 12
- Max_font_size: 32
- Font_units: 'px'
- Random_points: 50-add random point to sphere to improve the effect
- Foreground_colour: # fff-accepted formats: #333 # 0a0a0a and RGB (N, N, N)
- Background_colour: RGB (, 0)-color names cannot be used
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 Tag:
< 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 >
Is it easy? You can easily add tags to your website!
Click to download