為博客園添加標簽雲動畫


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();    //合並所有div
    foreach($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前的div
            while(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>

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM