`

网站标签云

阅读更多

 昨天超站的版主小光头看到一个网站上有一个TAGS云的特效,很漂亮也很有个性。我上去看了一下,原来是3D标签云。说实话确实很漂亮,这个3D标签云实现起来后可以将所有的标签都集中在一个FLASH里,并且所有的标签组成的标签云还会在这个3D标签云内形成一个球形不断的滚动;当你的鼠标移动到这个3D标签云内的任何一个标签时,所有标签会加速滚动,并且所你选择的那个标签会自动滚到最前。如图:

     我一看到这个3D标签云的特效的时候,我也一下子喜欢上了,而且很巧合,之前我也在另一个网站上看到同样的效果。于是我就答应小光头帮他把代码拿出来,费了好长的时间我才弄清楚这个特效。下面是我实现之后的效果演示:http://www.yi7.org/demo/3d-tags-demo.htm

     这个3D标签云代码如下:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="240" height="200" id="myFlashContent">
<param name="movie" value="3dtags.swf" />
<param name="allowfullscreen" value="true" />
<param name="allowscriptaccess" value="always" />
<param name="wmode" value="transparent" />
<param name="allownetworking" value="all" />
<param name="flashvars" value='jsonData=
{"type":"tagBall","delicacy":2,"renderCycleTime":20,"radius":80,"focalLength":300,"color":"#000000","rotationModeX":14,"rotationModeY":14,"elements":
[{"type":"text","data":"2009","hcolor":"0xFF6600","size":16,"bold":1,"herf":"http://www.yi7.org/catalog.asp?tags=2009","window":"_blank","fontFamily":"\u5fae\u8f6f\u96c5\u9ed1"}]}' />
<a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash
player" /></a>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object>

     上面的代码中,只给出了一个标签的链接,红色部分为一个完整的标签代码,多个标签用半角逗号隔开;上面的代码中蓝色部分为你的标签和链接的地址,除了这两个地方要改,其余的不需要改。 如果要改变显示的大小,请直接修改代码第一行中的width="240" height="200"部分。

     这样3D标签云特效需要用到一个.swf的文件,下载这个文件请登陆http://bbs.supadmin.com/thread-26654-1-1.html。下载后上传到您的网站,同时请在上面代码第二行中的“<param name="movie" value="3dtags.swf" />”将该swf的文件路径修改正确,如果不会相对路径,可以使用绝对路径。

     因为我也是匆忙中找到的这个代码,虽然不是很完美,但是确实可以使用,而且如果您使用的CMS或你的网站程序支持循环标签调用的话,要实现起来还是比较简单的。如果对上面的代码看得不是很明白,请直接查看演示页面http://www.yi7.org/demo/3d-tags-demo.htm的源代码,仔细分析很容易找出规律。本来我也想做一个直接拿去就可以用的代码,但是每个人使用的网站程序不一样,标签的调用方法也不一样,而且我看了大部分网站的在3D标签云的效果都是使用的网站程序的插件,所以我无法提供直接拿去就能用的代码。

     当然,如果您发现有更完美的3D标签云的调用方式,请您分享给我。

     最后,关于这个3D标签云的使用,有几点需要注意:1)、链接中好像不能有中文字符,否则链接会出错;2)、支持最大的显示效果是240X200,超过这个范围标签的显示范围也就这样大,四周会出现很多空白,但是对于缩小没有限制,这应该是那个swf文件的原因;3)、这个3D标签云内不要放太多的标签,因为他的显示大小有限,多了会显得密密麻麻,反而不好看了;4)、要浏览到这个3D标签云的特效,需要你的浏览器支持flashplayer插件,我在本机测试IE内核的浏览器直接就可以浏览,但是火狐内核的浏览器需要下载安装flashplayer。

分享到:
评论

相关推荐

    标签云源代码(类似百度搜索风向标的Flash标签云)

    1Flash标签云 index.html页面里有tagcloud.swf和tagcloud.xml两个文件的连接,但是测试只能使用http的方式,不能使用文件夹路径, 所以使用时把tagcloud.swf和tagcloud.xml两个文件放在IIS或网站服务器下,就可以正常...

    flash立体标签云

    3D Flash标签云的应用不仅仅局限于网站的首页或者侧边栏,还可以用在产品展示、新闻分类、用户推荐等多个场景。这种技术能够帮助网站提升用户体验,增加用户停留时间,同时也能提升品牌形象,使网站在众多竞争对手中...

    3D滚动标签云

    【3D滚动标签云】是一种视觉...通过以上知识点的学习和实践,你可以创建出具有专业水准的3D滚动标签云,为你的网站或应用增添独特的视觉魅力。在实际开发中,可参考“3dLable”这个文件中的示例代码,逐步理解和改进。

    jquery标签云制作无规则标签云样式

    本教程将聚焦于如何利用jQuery创建一个无规则的标签云,这种标签云不仅视觉效果独特,而且能有效地展示和突出网站上的关键词或主题。 首先,我们需要了解标签云的基本概念。标签云是一种可视化技术,用于显示网站或...

    标签云支持中文

    标签云(Tag Cloud)是一种常见的用户界面元素,用于展示关键词或标签,通常用来表示网站内容的分类或者用户生成的内容标签。它通过字体大小或颜色深浅来表示每个标签的重要性或出现频率,用户可以通过点击标签来...

    joomla 标签云模块

    总的来说,"Joomla 标签云模块"是一个用于展示网站标签的实用工具,可以提升用户对网站内容的导航体验。然而,由于对Flash的依赖,建议检查你的用户群体是否仍能顺利访问和使用这个功能,或者考虑升级到一个无需...

    标签云的工具

    通过"wp-cumulus",网站管理员可以轻松地创建和管理标签云,不仅提升了用户体验,也使网站内容更加有序和易于访问。总的来说,标签云作为一种有效的信息组织和导航工具,在IT领域尤其是内容管理方面有着广泛的应用,...

    标签云(flash)

    标签云是一种视觉呈现方式,常用于网站或应用中,它以文字的形式展示信息,并通过字体大小、颜色等视觉元素来突出显示数据的权重或频率。在Flash技术的支持下,标签云能够实现动态交互效果,为用户提供更加生动和...

    Flex 3D标签云

    Flex 3D标签云是一种在Flex平台上创建动态、立体效果的标签展示技术,它通过将传统的二维标签转换为三维空间中的旋转元素,为用户提供了更直观、更具视觉吸引力的交互体验。这种技术常用于网站、应用程序或者数据...

    三种标签云前端效果自选.zip

    标签云通常用于网站上,以一种视觉上吸引人的方式显示关键字或主题,帮助用户快速浏览和点击感兴趣的内容。 首先,我们要理解HTML5(HTML的第五次重大修订)在其中的角色。HTML5提供了更丰富的语义化标签,如、、和...

    dede织梦3D标签云

    【dede织梦3D标签云】是一款基于DEDECMS(织梦内容管理系统)的插件,它在传统的标签云基础上进行了创新,引入了3D视觉效果,使得网站的标签展示更加生动活泼,能吸引用户的注意力。这款插件借鉴了WordPress(wp)的...

    精致的标签云

    【精致的标签云】是一...综上所述,构建一个效果炫酷的【精致的标签云】需要掌握HTML、CSS以及JavaScript的基本技能,通过巧妙地组合运用这些技术,可以创建出既美观又实用的网页互动元素,提高用户在网站的浏览体验。

    标签云Flash版+js版

    在实际应用中,标签云常被用作网站分类导航,用户可以通过点击不同标签快速浏览相关的内容。配合后台系统,标签云的内容可以实现动态发布,即根据数据库中的信息实时更新,这样可以确保用户总是看到最新、最相关的...

    js版标签云

    JavaScript实现的标签云不仅能够美观地展示信息,还可以提升用户在网站上的交互体验。通过自定义算法和CSS样式,你可以创建一个符合项目需求的独特标签云。无论是在博客、社交媒体还是任何其他Web应用中,标签云都是...

    3d 标签云 中英文

    在实际应用中,3D标签云不仅适用于网站导航,也可以用于数据可视化,比如显示热门话题、用户标签、产品分类等。通过这种动态的展示方式,用户能更快速地捕捉关键信息,同时增加网页的趣味性和用户体验。然而,需要...

    搜索风向标,标签云

    "标签云"则是另一种信息展示方式,尤其在网站中常见,它通过不同大小的字体来表示各个关键词的相对重要性或出现频率。 "搜索风向标"通常会实时更新,显示近期最热门的搜索关键词,为用户提供当前热点话题的直观参考...

    3D球形标签云.rar

    3D球形标签云是一种创新的可视化技术,它将传统的标签云以三维立体的形式呈现,为网站或应用的用户界面增添了动态和互动性。这种设计通常由HTML、CSS和JavaScript技术构建,使得标签在视觉上形成一个球体,每个标签...

    标签云html源码学习.rar

    标签云是一种常见的网页元素,常用于展示网站内容的关键词或主题,通过不同的字体大小和颜色来突出显示每个标签的重要性或频率。在这个“标签云html源码学习.rar”压缩包中,我们可以期待找到实现这一功能的HTML和...

    FLASH 标签云 AS3

    标签云是一种信息可视化技术,通常用于网站上,以显示热门或相关的标签,使用户可以快速浏览并点击感兴趣的主题。在AS3中实现3D标签云,我们需要掌握以下几个关键知识点: 1. **对象和类**:AS3基于ECMAScript 4...

    JS 写的标签云

    在这个“JS写的标签云”项目中,我们可以理解到它涉及到动态展示标签的技术,这种技术常用于博客、新闻网站等,以可视化的形式展示关键词或主题,用户可以轻松点击探索相关内容。 首先,我们要明白标签云的工作原理...

Global site tag (gtag.js) - Google Analytics