2005
Oct
3rd
サイドバーには最新コメントや最新トラックバックのリンクがあるのですが、このURLは
そんなおり、ハテナオヤさんのtDiary は未来を先取りした日記ツールにて、tDiaryのhilightプラグインやWeb Interface Design Tip: The Yellow Fade Techniqueに行き当たったので、JavaScript を使って The Yellow Fade Technique 風なUIにしてみました。例えば、上記のhttp://matatabi.homeip.net/blog/setomits/466#comment571を見てみると、
追記: 19:40
タイトルの部分だけだとちょっとわかりにくいかなと思い、コメント全体の背景色が変わるように変更しました。
http://matatabi.homeip.net/blog/setomits/466#comment571と、あるエントリのコメントなりトラックバック自体のアンカーをさすようになっています。この場合、リンクをクリックしてページが遷移して途中までスクロールされているけど、どこが該当箇所なのかわからないことがあります。
そんなおり、ハテナオヤさんのtDiary は未来を先取りした日記ツールにて、tDiaryのhilightプラグインやWeb Interface Design Tip: The Yellow Fade Techniqueに行き当たったので、JavaScript を使って The Yellow Fade Technique 風なUIにしてみました。例えば、上記のhttp://matatabi.homeip.net/blog/setomits/466#comment571を見てみると、
Re: コメントスパム弾き実験 2の部分の背景色が徐々に変わります。
追記: 19:40
タイトルの部分だけだとちょっとわかりにくいかなと思い、コメント全体の背景色が変わるように変更しました。
ということで、したこと。
COREBlog インスタンスのコンテンツから、次の3つを変更しました。
- comment_body
- trackback_body
- entry_html
<dtml-in comment_list> や <dtml-in trackback_list> が終わった後(僕はサイドバーの後に持ってきてますが)に、
この例では色は10色用意していて、切り替えは300ミリ秒ごとに行っています。
このあたりは使用する環境に応じて。
追記: 19:41
タイトルだけでなく、コメント全体の背景色が変わるようにしました。ということで、
- comment_body
- trackback_body
- entry_html
また、色合いもスタートの色をもうちょい薄いところから始めるように変更しました。
まあそれぞれで環境は違うし、どうでも良いことですね。
COREBlog インスタンスのコンテンツから、次の3つを変更しました。
- comment_body
<div class="comments-title">を
<div class="comments-title" id="#comment<dtml-var id>">に。
- trackback_body
<div class="trackback-title">を
<div class="trackback-title" id="#trackback<dtml-var id>">に。
- entry_html
<dtml-in comment_list> や <dtml-in trackback_list> が終わった後(僕はサイドバーの後に持ってきてますが)に、
<script type="text/javascript">
var fcs = window.location.hash;
if(fcs.length) {
var colors = new Array("#FF5511", "#FF6622", "#FF7733", "#FF8844", "#FF9955",
"#FFAA66", "#FFBB77", "#FFCC88", "#FFDD99", "#FFEEAA");
function change_color(num) {
if (num == colors.length)
return;
document.getElementById(fcs).style.backgroundColor = colors[num];
setTimeout("change_color(" + String(num+1) + ")", 300);
}
change_color(0);
}
</script>
というコードを挿入。この例では色は10色用意していて、切り替えは300ミリ秒ごとに行っています。
このあたりは使用する環境に応じて。
追記: 19:41
タイトルだけでなく、コメント全体の背景色が変わるようにしました。ということで、
- comment_body
<div class="comments-title">ではなく、1行上の
<div class="comments-body">の方を
<div class="comments-body" id="#comment<dtml-var id>">に。
- trackback_body
<div class="trackback-title">ではなく、1行上の
<div class="trackback-body">の方を
<div class="trackback-body" id="#trackback<dtml-var id>">に。
- entry_html
また、色合いもスタートの色をもうちょい薄いところから始めるように変更しました。
まあそれぞれで環境は違うし、どうでも良いことですね。
Posted by setomits at 02:37 |
Comments: 0