相关选项

zoom: 90 初始的缩放度

min_zoom: 25

max_zoom: 120

zoom_factor: 2 - 鼠标滚轮的缩放速度

rotate_factor: -0.45 - 鼠标移动时球体旋转的数量。正数将反向旋转

fps: 10 - 定义每秒动画更新的次数

centrex: 250 - 在container div中水平方向旋转中心

centrey: 250 在container div中垂直方向旋转中心

min_font_size: 12

max_font_size: 32

font_units: 'px'

random_points: 50 - 添加一些随机的点到球体来提高效果

foreground_colour: #fff - 接受的格式为： #333 #0A0A0A 和 rgb(n,n,n)

background_colour: rgb(0,0,0) - 不能使用颜色名字

Javascript代码：

复制代码 代码如下:

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

演示中的代码如下：

复制代码 代码如下:

$(function(){

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

});

HTML标签：

复制代码 代码如下:

<div id="ts1">

<ul>

<li><a href="http://www.gbin1.com/technology/html" 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" 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" rel="20">Design</a></li>

</ul>

</div>

【jquery 3D 标签云示例代码】相关文章：

★ 7个有用的jQuery代码片段分享

★ Jquery注册事件实现方法

★ JQuery分屏指示器图片轮换效果实例

★ Jquery zTree 树控件异步加载操作

★ jQuery实现将页面上HTML标签换成另外标签的方法

★ jquery中map函数遍历数组用法实例

★ Jquery中基本选择器用法实例详解

★ 光标定位等TextRange的操作的范例代码

★ jquery实现弹出层效果实例

★ js鼠标事件