如何在hexo博客首页中实现漂亮的文字云（word cloud）效果？

Question

如何将博客中的文章标题制作成文字云放在首页？点击标题即可跳转相应的页面。

例如wolfram首页（http://www.wolfram.com/）的效果

不同文字大小不同，鼠标滑过有颜色渐隐效果

不知这种效果在hexo博客中能否实现？

Answer 1

肯定是能的，Hexo只是一个静态渲染的引擎而已。

鼠标划过的动态效果是通过JS实现的：

$('.initial_hidden').each(function(i) {
var $fader = $(this);
setTimeout(function() {$fader.addClass('fade_this_in');}, i*50+450);
setTimeout(function() {$fader.addClass('gray_link');}, i*50+1200);
});
$('#spikeyarea').mouseover(function(e) {$('#spikeydiv').toggleClass('spikeyhighlight');});
$('#spikeyarea').mouseout(function(e) {$('#spikeydiv').toggleClass('spikeyhighlight');});

然后文字大小不同，你可以参考Hexo官方的tagcloud实现：

https://github.com/hexojs/hexo/blob/master/lib/plugins/helper/tagcloud.js