旧フォーラムの記事です http://blog.fc2.com/forum/viewtopic.php?f=3&t=10542
bazagoza 2006-05-26 23:15:48
件名 ：コメントのツリー化
OS：WinXP
ブラウザ環境： Internet Explorer
使用テンプレート名： arrow_o （公式テンプレートを３カラム化してカスタマイズ）
ブログURL： http://bazagoza.blog50.fc2.com/
アダルトか否か：一般
こちらの質問掲示板でお世話になりながらブログカスタマイズをしているものです。
以前にもコメントのツリー化スクリプトで洵さんの修正スクリプト
http://webbingstudio.blog10.fc2.com/blog-entry-277.html
をお借りしてつくることコメントをツリー化したのですが、今回コメントのツリー元の親記事部分だけでなく、枝であるひとつひとつのコメントにもリンクして見れるようにしたいなと考えています。どのようにすればできるのでしょうか？
またコメントのツリー元の親記事部分の最初が空白で一文字分くらい空いてるのですが左詰めにしてそろえるにはどうしたらよいでしょうか？
コメント部分HTML
<div id="commentlist">
<%rcomment_etitle><br><a href="<%rcomment_link>#comment"><%rcomment_name>: <%rcomment_title> (<%rcomment_month>/<%rcomment_day>)</a>
</div>
#commentlist {
font-size: 85%;
margin: 0 0 0 -5px;
padding: 0.7em;
}
#commentlist li {
list-style-type: none;
}
このコミュニティにご参加頂くと、コメントの書き込みができます
/* サイドメニュー内のツリー化 */
#commentlist ul, #trackbacklist ul {
margin : 0;
padding : 0;
list-style-type : none;
}
#commentlist ul.list-tree, #trackbacklist ul.list-tree {
margin : 1em 0;
}
#commentlist ul li ul li, #trackbacklist ul li ul li {
margin : 0;
padding-left : 20px;
background : transparent url("http://blog50.fc2.com/b/bazagoza/file/tree_lst_dotted.gif") top left no-repeat;
}
#commentlist ul li ul li.lastchild, #trackbacklist ul li ul li.lastchild {
background : transparent url("http://blog50.fc2.com/b/bazagoza/file/tree_end_dotted.gif") top left no-repeat;
}
/* コメントリストの設定 */
h3#commenthead, h3#trackbackhead {
font-size: 12px;
line-height: 1;
font-weight: bold;
color: #FFF;
text-transform: uppercase;
margin: 5px 0;
padding: 6px 0 6px 25px;
background: url(<a class="postlink" href="http://blog1.fc2.com/template/arrow_o/image/commenthead.jpg">http://blog1.fc2.com/template/arrow_o/i ... nthead.jpg</a>) no-repeat;
border-width: 0;
}
#commentlist {
margin: 0 0 0 -5px;
padding: 0.7em;
}
公式テンプレートの「skin14」や「cfdn_13」などの【萌え系イラストシリーズ】にも、
このスクリプトが導入されていますので参考にされるとよいと思います。
（左詰めなども...）
どうにもバグってしまってます。どう不具合がありますか？
自分の改良したいのはツリー元の親記事も、枝のコメント両方にリンクがつくようにしたいのです。
<script type="text/javascript">New</span>')}
}
--></script>
.new {color:red; font-weight:bolder;}
<div id="commentlist">
<%rcomment_etitle><br><a href="<%rcomment_link>#comment<%rcomment_no>" title="<%rcomment_body>"><%rcomment_name>: <%rcomment_title> (<%rcomment_month>/<%rcomment_day>)</a>
<script type="text/javascript">
nw(<%rcomment_year>,<%rcomment_month>,<%rcomment_day>,<%rcomment_hour>)
</script>
10件中、1～10件表示
Anonymous 2006-05-31 19:40:03
件名 ：
うわー、ありがとうございます！ きれいに文字のバランスもなおり、「→」もなくなり感謝感激です(;つД｀)
chakoさん、sugarさん、未登録ユーザーさんご親切にアドバイスいただき、本当にありがとうございます