2013.03.21
WordPress キノコは最初から隠すべき キリッ！（コメント件数の表示）
n
先日からごにょごにょと何やらしている当ブログ。
jQuery 重いらしいcontainsフィルターを書き換えてみる
でコメントの有る無しでコメントの件数の表示をon/offするjQueryをふんだららーと記述しておりますのをまた変えてみました。
|
1 2 3 4 5 6 |
<h2 class="title"> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </h2> <div class="comments-link"> <a href="<?php comments_link(); ?>"><?php comments_number('n', '1', '%'); ?></a> </div> |
ループで記事のタイトル周りに件数を表示させています。 comment_numberの引数にそれぞれn＝なし 1=１件 %=それ以上の数字を渡してます。
んで、前回はnのコメントが無い時を条件にjQueryでスクリプトを書いたのですが、今回はコメントがある時を条件に書き直してみました。
なぜかと言うと、やっぱりキノコがちら見えしちゃうからですw
あった物が消えてしまうのはコンマ何秒とはいえ、とっても不自然です。
逆に遅れて表示されるぶんには違和感がありません。コメントも滅多にないしねw
そこで、始めからcssでcomments-linkのdivをdisplay:none;で非表示にすることにしました〜。
よけいなリンクができちゃうなというのは、今回は無視。うっ。
|
1 2 3 4 |
var comm_l = $('.comments-link','#main'); comm_l.find('a').filter(function () { return /\d/m.test($(this).text()); }).parent().addClass('on_comments-link'); |
ハイライトした三行目、以前正規表現で文字列 n を探していた部分を\dと書き換えただけー。
\dは正規表現で数字を示してます。
aのテキストに数字があった時、親要素にclass on_comments-linkを追加。
よけいな処理をするのかなーと思って前回検証した.matchはやっぱり.testに書き換えました。
|
1 2 |
.comments-link {display:none;} .on_comments-link {display: block;} |
cssでは、.on_comments-linkにdisplay:blockを指定して上書き。
そんなけ。そんなけにたどり着くまでずいぶん時間を要したなぁ。
…勉強になった！
