先日タグリストを造る時に、先頭の文字を強調するよう
BLOGGERからの移行完了にphpで取り出しを書いたが、
css で
a:first-letter{font-size:125%;}
なんて簡単なのもあるが、思うようにできず、サクッとjqueryでやってみた。
$("a[rel='tag']").each(function() {//a タグに rel=tagをつけた場合で、$("a")ならリンクタグ全て、$("a.inpact")ならclass=inpactのあるaタグという意味です。
var first_letter = $(this).text().substr(0,1);
var after_letter = $(this).text().substr(1,$(this).text().length);
// ランダムカラーの場合 右サイドのタグリスト
//var color = Math.round(0xffffff * Math.random());
//$(this).html("<b style='color:rgb(" + (color >> 16) + "," + (color >> 8 & 255) + "," + (color & 255)+");font:bold 120%/1.2em \"HG丸ｺﾞｼｯｸM-PRO\"'>"+first_letter+"</b>"+after_letter);
//英数字と日本語を分ける場合。
if(first_letter.search(/\w/i) != -1){
$(this).html("<b style='color:#c09;font:130%/1em \"Comic Sans MS\",\"Times New Roman\"'>"+first_letter+"</b>"+after_letter);
}else{
$(this).html("<b style='color:#60f;font:bold 125%/1em \"HG丸ｺﾞｼｯｸM-PRO\"'>"+first_letter+"</b>"+after_letter);
}