刚接触前端时,看着w3cplus这个部分时,觉得每个a标签的字体大小都应用是写死了的(哎,新人,不会,没办法),今天看见一篇文章介绍随机生成颜色的方法,特引用来随机生成字体大小,核心思想如下:
一个待选字体大小的数组,然后从这个数组中随机选出一个,给这些a标签设置font-size,就大功告成,
[1,1.2,1.4,1.6,1.8,2,2.4][a] //这里的a就是随机生成的数字,当然只能是0--6之间,因此
var a =Math.floor(Math.random()*7);
完整代码如下:
$('.content a').each(function(){ $(this).css('fontSize',[1,1.2,1.4,1.6,1.8,2,2.4][Math.floor(Math.random()*7)]+'em') })
现在在重新进入页面,你会发现这个模块的a标签在每次进入时字体大小都会随机变化,当然,你不想字体以style出现在行间,也可以事先定义一组类名,每个类名拥有不同的字体大小,然后给每个a标签随机这些类名,
$(‘.content a’).each(function(){
$(this).attr(‘class’,’leave’+[1,2,3,4,5,6,7][Math.floor(Math.random()*7)])
})
今天发现,上面的两种方法,并没有做到真正的随机生成,只是随机事先预备好的一些数据,特重新编译了下面方法:
$('.content a').each(function(){ $(this).css('fontSize',(getFontSize=function(){ fontsize=Math.round(Math.random()*30)/10 if(fontsize<1){ return getFontSize() } return fontsize })()+'em') })
OK,记录至此,以防将来自己用到时又忘了!