Bonjour!

« 日記/日本酒 | トップページ | 日記 »

2004-01-18

サイドバーを折り返す

サイドバーが長くなっているので両サイドにしたいんだけど、左サイドバーを置くと重くなるし、音声ブラウザにもやさしくないかなと思い、右サイドバーだけにしています。対処療法としてNAVIを置いたんですが、最近の記事を一瞥してパッと知りたいという要望を受け、NAVIと最近の記事の両方を上部に一度に表示させたいと考えました。

ということで、やった小技:サイドバーの折り返し(^_^;)。

マイリストを使いました。まず、新しくマイリスト(リスト型)を作成。タイトルはステルス化しておきました。作成後、すぐに公開し、メモ欄をテキスト表示に設定。項目を追加で、タイトルを「(ページトップに戻る)」、URLを「# 」とし、メモ欄に下記を記入して保存。ウェブログのデザインの並び替えで、このマイリストを折り返したい地点に配置しますすれば一応完了です

</li>
</ul>
</div> <!-- .sidebar -->
</div> <!-- #right -->

<div id="right2"> <div class="sidebar"> <ul class="dummy"> <li>

なお、right2というdivを新しく作成しているので、CSSの#rightの部分をそっくりコピーした#right2を追加しています。無くても右端ならそれほど問題はないかと思いますが、若干デザインが乱れたりするかもしれません。以下のコードはあったほうが良さそうな感じです。

#right2 {
float: left;
width: 200px;
overflow: hidden;
}

また、上記だけだと折り返して新しくできたサイドバーの上部に間があいてしまうので、さらに .dummy { display:none; } も追加しています。


*** 追記 2004-01-18 23:00 ***

折り返すついでに、#rightを左サイドに飛ばして擬似的に両サイドバーにしてみました。なら最初から両サイドバーにすれば?との声も聞こえてきそうですが(^_^;)、まあ、いろいろ実験中ということで。
# 本当は#right2を左に飛ばしたかったんですが、IE5でどうしても上手くいきませんでした(;_;)。

« 日記/日本酒 | トップページ | 日記 »

ウェブログ・ココログ関連」カテゴリの記事

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/1941/113516

この記事へのトラックバック一覧です: サイドバーを折り返す:

» [Tips] サイドバーを折り返す [あそびをせんとやうまれけむ]
facet-diversで、サイドバーを折り返すという素晴らしい Tips [続きを読む]

» サイドバー折り返し2 [facet-divers]
ずっと前に「サイドバーを折り返す」ってのをやったんですが、takoさんちが右サイドバー2列にデザイン変更したのを見て、そういえばココログのHTML構造が新しくな [続きを読む]

« 日記/日本酒 | トップページ | 日記 »

contact

検索

無料ブログはココログ
2017年11月
      1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30    

BANNERS