为博客园添加标签云动画

article/2025/8/21 7:28:40

canrun

 优化版(分隔线以上直接实现3D标签云效果展示):

  一、在博客园管理-设置-页首Html代码中加入:

  <script type="text/javascript" src="http://files.cnblogs.com/Zjmainstay/swfobject.js"></script>

      <script type="text/javascript" src="http://demo.zjmainstay.cn/cnblogs/getTags.php?url=http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F"></script>
      <script type="text/javascript" src="http://files.cnblogs.com/Zjmainstay/Zjmainstay_cnblogs_tags.js"></script>

  注1:请修改第一个script的src的url=部分,修改成你自己的博客园域名,为http://www.cnblogs.com/Zjmainstay/tag/的urlencode结果。第二个script不变。

  注2:http://demo.zjmainstay.cn/cnblogs/getTags.php?hl可获取getTags.php源码,也是下面的get_cnblogs_tags.php的源码。

  二、设置-页脚Html代码中加入:

  <div id="ZjmainstayCnblogsSWFTags"></div>

  三、设置-通过CSS定制页面风格 加入:

  #ZjmainstayCnblogsSWFTags{
      overflow: visible;
      position: absolute;
      right: 10px;
      top: 735px;
      width: 160px;
      z-index: 10000;
  }

    ********************** 分隔 ******************************************* 分隔 *******************************************

    注:分隔线以下为功能实现讲解,优化版为后期补充,方便园友快速使用。

    昨天晚上在一个其他站点的博客上看到了一个标签云动画,挺喜欢的,动手把它移植到了博客园上了,嘿嘿~

    定制标签云主要涉及2个外部引用的js文件:swfobject.js 和 Zjmainstay_cnblogs_tags.js,和一个动画文件:tagcloud.swf,还有一个后台解析博客园标签生成标签云动画参数var tag的get_cnblogs_tags.php文件。swfobject.js 、tagcloud.swf是给Zjmainstay_cnblogs_tags.js调用来创建标签云动画用的。下面是Zjmainstay_cnblogs_tags.js的源码:

    注:tags内容太长,这里提取出来:  

var tags
var tags = "%3Ctags%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fphp%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Ephp%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FjQuery%2520ajax%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EjQuery+ajax%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FgetPage%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EgetPage%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Furl%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eurl%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FjQuery%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EjQuery%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FJS%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EJS%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fimage%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eimage%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fvisio%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Evisio%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FCSS%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3ECSS%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FdivideQuery%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EdivideQuery%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FIP%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EIP%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FVNC%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EVNC%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FHTML%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EHTML%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Ffile_get_contents%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Efile_get_contents%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FJavascript%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EJavascript%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E7%2599%25BE%25E5%25BA%25A6%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E7%99%BE%E5%BA%A6%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FFireFox%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EFireFox%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FDelete%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EDelete%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fjoomla%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Ejoomla%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E8%25B6%2585%25E6%2597%25B6%25E6%258E%25A7%25E5%2588%25B6%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E8%B6%85%E6%97%B6%E6%8E%A7%E5%88%B6%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FDIV%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EDIV%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FAdd%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EAdd%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FjQery%2520Ajax%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EjQery+Ajax%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E5%259C%25B0%25E5%259D%2580%25E6%25A0%258F%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E5%9C%B0%E5%9D%80%E6%A0%8F%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FMySQL%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EMySQL%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FAjax%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EAjax%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Freadonly%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Ereadonly%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E5%258A%25A8%25E6%2580%2581%25E5%2588%259B%25E5%25BB%25BA%25E8%25A1%25A8%25E6%25A0%25BC%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E5%8A%A8%E6%80%81%E5%88%9B%E5%BB%BA%E8%A1%A8%E6%A0%BC%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FJS%2520format%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EJS+format%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fappend%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eappend%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fsearch%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Esearch%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E5%2588%2586%25E4%25BA%25AB%25E6%258C%2589%25E9%2592%25AE%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E5%88%86%E4%BA%AB%E6%8C%89%E9%92%AE%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E6%2590%259C%25E7%25B4%25A2%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E6%90%9C%E7%B4%A2%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Farray%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Earray%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fselect%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eselect%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E7%2581%25AB%25E7%258B%2590%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E7%81%AB%E7%8B%90%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E7%25BA%25BF%25E7%25B2%2597%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E7%BA%BF%E7%B2%97%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FCircle%2520DIV%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3ECircle+DIV%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FselectedIndex%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EselectedIndex%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E8%258E%25B7%25E5%258F%2596%25E9%25A1%25B5%25E9%259D%25A2%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E8%8E%B7%E5%8F%96%E9%A1%B5%E9%9D%A2%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fli%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eli%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Ffiregestures%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Efiregestures%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fselect%25E5%258F%25AA%25E8%25AF%25BB%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eselect%E5%8F%AA%E8%AF%BB%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E4%25B8%2589%25E8%25A7%2592%25E5%25BD%25A2div%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E4%B8%89%E8%A7%92%E5%BD%A2div%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Flink%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Elink%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2FFloat%2520DIV%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3EFloat+DIV%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fshare%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eshare%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E9%25BC%25A0%25E6%25A0%2587%25E6%2589%258B%25E5%258A%25BF%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E9%BC%A0%E6%A0%87%E6%89%8B%E5%8A%BF%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fmouse%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Emouse%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fgesture%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Egesture%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Ftxt%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Etxt%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F%25E6%2595%25B0%25E6%258D%25AE%25E5%25BA%2593%25E9%2599%25A4%25E8%25BF%2590%25E7%25AE%2597%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3E%E6%95%B0%E6%8D%AE%E5%BA%93%E9%99%A4%E8%BF%90%E7%AE%97%3C%2Fa%3E%3Ca+href%3D%27http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2Fonchange%2F%27+class%3D%27tag-link-118%27+title%3D%271+%E4%B8%AA%E8%AF%9D%E9%A2%98%27+style%3D%27font-size%3A+8pt%3B%27%3Eonchange%3C%2Fa%3E%3C%2Ftags%3E";
$(document).ready(function(){var tags = "";  //上面的tags//decodeURIComponent(tags);var widget_so2406005 = new SWFObject("http://files.cnblogs.com/Zjmainstay/tagcloud.swf", "tagcloudflash", "200", "200", "9", "#282828");widget_so2406005.addParam("allowScriptAccess", "always");widget_so2406005.addVariable("tcolor", "0xff0000");widget_so2406005.addVariable("tcolor2", "0x333333");widget_so2406005.addVariable("hicolor", "0x000000");widget_so2406005.addVariable("tspeed", "100");widget_so2406005.addVariable("distr", "true");widget_so2406005.addVariable("mode", "tags");widget_so2406005.addVariable("tagcloud", tags);widget_so2406005.write("ZjmainstayCnblogsSWFTags");// $.ajax({// url:'http://demo.zjmainstay.cn/cnblogs/getTags.php?url='+encodeURIComponent('http://www.cnblogs.com/Zjmainstay/tag/'),// success:function(data){// if(data != 'false') tags = data;// var widget_so2406005 = new SWFObject("http://www.yiiyaa.net/wp-content/plugins/wp-cumulus/tagcloud.swf?r=9147033", "tagcloudflash", "200", "200", "9", "#282828");// widget_so2406005.addParam("allowScriptAccess", "always");// widget_so2406005.addVariable("tcolor", "0xff0000");// widget_so2406005.addVariable("tcolor2", "0x333333");// widget_so2406005.addVariable("hicolor", "0x000000");// widget_so2406005.addVariable("tspeed", "100");// widget_so2406005.addVariable("distr", "true");// widget_so2406005.addVariable("mode", "tags");// widget_so2406005.addVariable("tagcloud", tags);// widget_so2406005.write("ZjmainstayCnblogsSWFTags");// },// error:function(){// var widget_so2406005 = new SWFObject("http://www.yiiyaa.net/wp-content/plugins/wp-cumulus/tagcloud.swf?r=9147033", "tagcloudflash", "200", "200", "9", "#282828");// widget_so2406005.addParam("allowScriptAccess", "always");// widget_so2406005.addVariable("tcolor", "0xff0000");// widget_so2406005.addVariable("tcolor2", "0x333333");// widget_so2406005.addVariable("hicolor", "0x000000");// widget_so2406005.addVariable("tspeed", "100");// widget_so2406005.addVariable("distr", "true");// widget_so2406005.addVariable("mode", "tags");// widget_so2406005.addVariable("tagcloud", tags);// widget_so2406005.write("ZjmainstayCnblogsSWFTags");// }// });
});

因为我调用的ajax响应服务器是一个免费php空间的,运行速度好慢,常常解析超时,因此被我屏蔽了。我采用了自己为var tag赋值的方式,而它的值是通过本地使用get_cnblogs_tags.php(ajax请求文件)获取博客园标签页解析并生成的,用户引用此部分ajax时,可自行修改$.ajax的url即可。get_cnblogs_tags.php源码如下:

View Code
<?php
header("Content-type: text/html; charset=utf-8"); 
$url = $_GET['url'];if(empty($url)) $url = 'http://www.cnblogs.com/Zjmainstay/tag/';$divData = getWebDiv('id="taglist"',$url);$pattern = '/<a(?:.*?)href="((?:http(?:s?):\/\/)?(?:[^\"\/]+)(?:[^\"]*))"(?:[^>]*?)>([^<]*?)<\/a>/i';
preg_match_all($pattern, $divData, $links);
$urls = $links[1];
$tags = $links[2];$output = '';
foreach($urls as $i => $url){$output .= urlencode("<a href='{$url}' class='tag-link-118' title='1 个话题' style='font-size: 8pt;'>{$tags[$i]}</a>");
}if(!empty($output)) echo urlencode('<tags>').$output.urlencode('</tags>');
else echo 'false';
exit(0);function getWebDiv($div_id,$url=false,$data=false){if($url !== false){$data = file_get_contents( $url );}$charset_pos = stripos($data,'charset');if($charset_pos) {if(stripos($data,'utf-8',$charset_pos)) {$data = iconv('utf-8','utf-8',$data);}else if(stripos($data,'gb2312',$charset_pos)) {$data = iconv('gb2312','utf-8',$data);}else if(stripos($data,'gbk',$charset_pos)) {$data = iconv('gbk','utf-8',$data);}}preg_match_all('/<div/i',$data,$pre_matches,PREG_OFFSET_CAPTURE);    //获取所有div前缀preg_match_all('/<\/div/i',$data,$suf_matches,PREG_OFFSET_CAPTURE); //获取所有div后缀$hit = strpos($data,$div_id);if($hit == -1) return false;    //未命中$divs = array();    //合并所有divforeach($pre_matches[0] as $index=>$pre_div){$divs[(int)$pre_div[1]] = 'p';$divs[(int)$suf_matches[0][$index][1]] = 's';    }//对div进行排序$sort = array_keys($divs);asort($sort);$count = count($pre_matches[0]);foreach($pre_matches[0] as $index=>$pre_div){//<div $hit <div+1    时div被命中if(($pre_matches[0][$index][1] < $hit) && ($hit < $pre_matches[0][$index+1][1])){$deeper = 0;//弹出被命中div前的divwhile(array_shift($sort) != $pre_matches[0][$index][1] && ($count--)) continue;//对剩余div进行匹配,若下一个为前缀,则向下一层,$deeper加1,//否则后退一层,$deeper减1,$deeper为0则命中匹配,计算div长度foreach($sort as $key){if($divs[$key] == 'p') $deeper++;else if($deeper == 0) {$length = $key-$pre_matches[0][$index][1];break;}else {$deeper--;}}$hitDivString = substr($data,$pre_matches[0][$index][1],$length).'</div>';break;}}return $hitDivString;
}

    Zjmainstay_cnblogs_tags.js中调用的SWFObject是从swfobject.js来的,而其参数SWFObject("http://files.cnblogs.com/Zjmainstay/tagcloud.swf", "tagcloudflash", "200", "200", "9", "#282828");中的tagcloud.swf,便是对tagcloud.swf文件的调用。

    至此,源码部分已经介绍完了。接下来是博客园对它的引用。

    博客园将其引用进来,主要是在博客园管理-设置-页首Html代码中加入:

<script type="text/javascript" src="http://files.cnblogs.com/Zjmainstay/swfobject.js"></script>
<script type="text/javascript" src="http://files.cnblogs.com/Zjmainstay/Zjmainstay_cnblogs_tags.js"></script>

 

并在设置-页脚Html代码中加入:

<div id="ZjmainstayCnblogsSWFTags"></div>

即可。这里的id="ZjmainstayCnblogsSWFTags" 对应Zjmainstay_cnblogs_tags.js中的write("ZjmainstayCnblogsSWFTags")。此时的<div id="ZjmainstayCnblogsSWFTags"></div>会显示在页脚,

为了让它显示在“我的标签”下面,在 设置-通过CSS定制页面风格 加入:

#ZjmainstayCnblogsSWFTags{position: absolute; left: 762px; top: 1186px;z-index:10000;
}

将其绝对定位至我的标签下面即可。

(完)

********************** 分隔 ******************

这里会发现一个问题:拖动页面右侧导航条的时候会发现动画浮动,好像卡机的感觉,求解决。

********************** 补充 ******************

独立标签云用例,请在下面运行此段代码后面填入“6”后点击运行,查看运行效果

 

View Code
<html><head><title>Zjmainstay 的标签</title><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta http-equiv="Content-Language" content="zh-CN" /><script type="text/javascript" src="http://files.cnblogs.com/Zjmainstay/jquery-1.6.2.min.js"></script><!-- SWFObject embed by Geoff Stearns geoff@deconcept.com http://blog.deconcept.com/swfobject/--><script src="http://files.cnblogs.com/Zjmainstay/swfobject.js" type="text/javascript"></script><script src="http://demo.zjmainstay.cn/cnblogs/getTags.php?url=http%3A%2F%2Fwww.cnblogs.com%2FZjmainstay%2Ftag%2F" type="text/javascript"></script><script src="http://files.cnblogs.com/Zjmainstay/Zjmainstay_cnblogs_tags.js" type="text/javascript"></script></head><body><div id="wp-cumulus" class="side_box"><h3>Zjmainstay 的标签</h3><div id="ZjmainstayCnblogsSWFTags"></div></div></body>
</html>

 

 

 


http://chatgpt.dhexx.cn/article/i1hOycLA.shtml

相关文章

服务器无响应无法加载,jquery - 无法加载资源:服务器响应状态为406(不可接受) - 堆栈内存溢出...

我在Chrome和Firefox浏览器控制台日志中遇到此错误 GET doaminipaddress.port / n / d85639d2ff510307eedab9f654a0d8a4.js&#xff1f;q y52W3GiXHD ... 886&#xff06;url http&#xff05;3A&#xff05;2F&#xff05;2domain.net&#xff05;2Fassets&#xff05;2Fscr…

OpenGL中如何绘制Bezier曲线和NURBS曲线

一、Bezier曲线 主要注意两个函数&#xff1a;glMap1和glEvalCoord1。 1.void glMap1{fd}(GLenum target,TYPE u1,TYPE u2,GLint stride, GLint order,const TYPE *points); 功能&#xff1a;定义求值器。  参数&#xff1a;target&#xff1a;指出了控制顶点的意义以及在po…

Nurbs样条线的原理及实现例码

最近做项目要用到到nurbs样条线&#xff0c;于是在网上找了一些Nurbs样条线的资料进行了研究&#xff0c;参照例子用自己的方法实现了Nurbs样条线&#xff0c;使用了几组例子进行测试。语言环境是OSG库。 &#xff08;1&#xff09;nurbs样条线的原理简介&#xff1a; 公式&…

【Blender】贝塞尔曲线(Bezier)和nurbs(NURBS)曲线有什么关系吗?

【Blender】贝塞尔曲线(Bezier)和nurbs(NURBS)曲线有什么关系吗&#xff1f; 【Blender】贝塞尔曲线(Bezier)和nurbs(NURBS)曲线有什么关系吗&#xff1f; 贝塞尔曲线最早提出&#xff0c;也最简单&#xff0c;但只能全局修改。B样条曲线稍后提出&#xff0c;解决了贝塞尔曲…

NURBS曲线-节点插入(原理+代码)

目录 1.概念及作用 2.原理及流程 1&#xff09;修改插入位置所在曲线的控制点 2&#xff09;修改受影响控制点的权值 3&#xff09;原节点矢量中新增目标节点 3.源码加注释 4.补充 1.概念及作用 设N为在节点矢量U{u_0&#xff0c;u_1&#xff0c;......&#xff0c;u_m}上的N…

理解Nurbs曲线/曲面的参数空间

人们对计算几何最常见的误解之一与曲线参数有关。 由于 Nurbs 曲线的数学相当复杂——其中大部分肯定超出了高中水平——很难解释控制点坐标、控制点权重、曲线度数和结向量如何共同使 nurbs 曲线的参数化变得复杂。 我自己对 Nurbs 数学的掌握充其量是皮毛&#xff0c;所以我…

Bezier曲线、B样条和NURBS的基本概念

最不能理解的一点&#xff0c;一讨论软件的曲面&#xff0c;曲线功能&#xff0c;最后就变成曲线、曲面的数学原理的讨论了&#xff0c;但是里面也没数学好的&#xff0c;讨论的结果可想而知。 我不是数学家&#xff0c;我不懂这么复杂的方程&#xff0c;只要好用就行了。 在CA…

NURBS曲线 和 NURBS曲面

NURBS曲线 NURBS曲线&#xff08;非均匀有理B样条&#xff09;是由分段有理B样条多项式基函数定义的&#xff0c;k阶NURBS曲线的定义如下&#xff1a; P ( t ) ∑ i 0 n w i P i N i , k ( t ) ∑ i 0 n w i N i , k ( t ) ∑ i 0 n P i R i , k ( t ) P(t)\frac{\sum_{i…

非均匀有理B-样条(Non-Uniform Rational B-Splines, NURBS)基础知识

B样条是无理的&#xff0c;组成无理B样条曲线或曲面。有理曲线或曲面可以精确地表示圆锥截面。非均匀有理B样条(Non-Uniform Rational B-Splines, NURBS)就是为了表达更精确的曲面引入的&#xff0c;其控制顶点包含权重。NURBS的基函数与B样条不同&#xff0c;但结点向量、张量…

MATLAB实现NURBS逼近曲线拟合及界面

目录 前言 一、数据点参数化 1.1原因 1.2方法 1.3代码(封装到类) 二、节点矢量计算 2.1方法 2.2代码 三、最小二乘反算控制点 四、基函数实现 五、豪斯多夫距离 六、离散曲率 总结 前言 采用matlab实现NURBS逼近曲线的拟合&#xff0c;利用app designer实现拟合的界…

NURBS Curves

文章目录 1. 定义2. 性质2.1 NURBS基函数的性质2.2 NURBS曲线的性质 3. 修改权重4. 相关算法4.1 节点插入&#xff1a;单点插入4.2 De Boors Algorithm 5. Rational Bzier Curves6. Rational Bzier Curves: Conic Sections7. Circular Arcs and Circles 1. 定义 NURBS&#xff…

Matlab中安装NURBS工具箱及使用

文章目录 前言一、NURBS工具箱的安装1 打开matlab&#xff0c;点击附加功能2 输入nurbs3 下载后压缩包解压4 将解压后的文件夹放到matlab文件夹的toolbox文件夹里面5 选择“预设路径”上方的“预设” 二、NURBS工具箱的使用2.1 NURBS 结构&#xff1a;2.2 对NURBS工具箱的初步理…

计算几何07_NURBS曲线与曲面

B样条方法在表示与设计自由曲线曲面时展现出强大的威力&#xff0c;但在设计与表示初等曲线曲面时却遇到了麻烦。因为B样条曲线、及其特例的Bezier曲线都不能精确表示除抛物线以外的二次曲线弧&#xff0c;B样条曲面、及其特例的Bezier曲面都不能精确表示除抛物面以外的二次曲面…

利用NURBS曲线进行点云曲面拟合算法

文章目录 介绍NURBS曲线C实现思路代码实现读取点云数据对点云进行预处理创建曲面模型将曲面模型转换为NURBS曲面 完整代码opennurbs.h说明vs2019安装OpenNURBS库编译OpenNURBS库 介绍 点云拟合曲面算法是将点云数据拟合成一个二次或高次曲面模型的算法。这种算法主要用于三维模…

离散数据点NURBS曲线拟合算法

问题描述&#xff1a;对于离散数据点集来说&#xff0c;其主要特征点一般可以描述原始曲线轨迹的基本形状。对于大量的离散数据点来说&#xff0c;提取主要的特征点后在进行曲线拟合&#xff0c;这样可以降低计算次数&#xff0c;极高拟合效率。 可以描述原始曲线几何形状的 特…

Nurbs建模

多边形建模和Nurbs建模 Nurbs始终有四个侧面&#xff0c;由有理多项式方程创立的曲线&#xff0c;由控制点定义的曲线。 Nurbs曲线是由一系列多项式构成的&#xff1a;axb0,ax^2bxc0… 能够将任何平面转换为Nurbs NURBS能买构建几乎所有的形状

matlab中Nurbs库的简单使用

文章目录 前言一、简单例子二、复杂一点的NUrbs曲面nrbeval函数 前言 只是为方便学习&#xff0c;不做其他用途&#xff0c;记录matlab中Nurbs的使用&#xff0c;好像记得是添加的matlab中的一个Nurbs库来着。前一段使用&#xff0c;现在不记得了&#xff0c;使用这个程序得先安…

NURBS

非均匀有理样条NURBS( Non-Uniform Rational B-Splines ) 是近年来发展迅速&#xff0c;应用广泛的一种表示曲线曲面造型技术。它能够精确地表示二次规则曲线曲面&#xff0c;从而能用统一的数学形式表示规则曲面与自由曲面&#xff0c;具有可影响曲线曲面形状的权因子&#xf…

【Matlab-NURBS工具箱简要教程及实例 】

Matlab-NURBS工具箱使用教程 添加NURBS工具箱 在附加功能里添加NURBS工具箱 安装完成后可以在’函数’处查看API&#xff0c;也打开文件夹查看。 强烈推荐同步安装gnurbs工具&#xff0c;它完全代替nrbplot展示曲面&#xff0c;且允许用户进行节点拖拽等操作。 NURBS 结…

Nurbs曲线详解

NURBS&#xff08;Non Uniform Rational B-spline&#xff09;曲线通常称为非均匀有理B样条曲线&#xff0c;其数学定义如下&#xff1a; 基函数由递推公式定义&#xff1a; 非均匀&#xff1a;指节点向量的值与间距可以为任意值。这样我们可以在不同区间上得到不同的混合…