2006.02.07をもってこのblogは引越しいたしました。
新blogURL : http://moo-t.net/
こちらではコメント&トラバを受け付けておりません。
お手数ですが、新blogにお越しくださいませ。

2004.09.14

■BlogPeopleリストをスクロール

なが〜ぃのをクルクル

■BlogPeopleリストをスクロール。[::SUNROOM:::さん]で、ええことを教えてもらった。
元ネタはBlogPeople リンクにスクロールバーをつける その2 -[PIROBLOGさん]。

BlogPeopleのリストってたくさん表示したいけど、長くなるの嫌だなぁと悩んでいる方多いと思います。
そこでひとつの解決策として、スクロールできるようにする方法が紹介されています。(具体的方法は、上記blogをご覧ください)

>>>



BlogPeopleは吐き出しデータのCSS Classを公開されているんですね。初めて知りました。見つけられたClassは下記の通り。(コメントアウトで説明文を書いているので、そのままCSSにコピペできます)

/* //////////////////////////////////// */
/* /// BlogPeople /// */
/* //////////////////////////////////// */

/* === リンクリスト全体 === */
.blogpeople-main {}

/* === 「更新マーク表示」で設定したリンクの前に表示するテキスト === */
.blogpeople-update-prefixtext{}

/* === 「更新マーク表示」で設定したリンクの後ろに表示するテキスト === */
.blogpeople-update-suffixtext{}

/* === リンクリストをTABLE形式で出力した場合のTABLE全体 === */
.blogpeople-table{}

/* === TABLE内TDタグ部分 === */
.blogpeople-td{}

/* === TABLE内TRタグ部分 === */
.blogpeople-tr{}

/* === DIV形式を選んだ場合のタイトル部分 === */
.blogpeople-linklist{}

/* === TABLE形式を選んだ場合のタイトル部分 === */
.blogpeople-tr-linklist{}

/* //////////////////////////////////// */
/* /// BlogPeople BB(Birthday Blog) /// */
/* //////////////////////////////////// */

/* === 全体のクラス名 === */
.blogpeople-bb{}

/* === リンク部分 === */
.blogpeople-bb-link{}

/* === クレジット部分 === */
.blogpeople-bb-credit{}

/* //////////////////////////////////// */
/* /// TrackBack People /// */
/* //////////////////////////////////// */

/* === リンクリスト全体に割り当てられたクラス === */
.blogpeople-tbp {}

/* === 各リンクタグに割り当てられたクラス === */
.blogpeople-tbp-link{}

/* === バナー画像に割り当てられたクラス === */
.blogpeople-tbp-credit{}

※ご注意:公開されているClassと実際使われているClassが違う場合があるようです。

ここでは、スクロールバーのデザインも合わせたかったので、このように設定しております。
/* === リンクリスト全体 === */
.blogpeople-main {
overflow: auto;
height: 100px;
scrollbar-face-color:#DDDDDD ;
scrollbar-arrow-color:#999999 ;
scrollbar-highlight-color:#FFFFFF ;
scrollbar-shadow-color:#FFFFFF ;
scrollbar-base-color:#EEEEEE ;
scrollbar-3dlight-color:#FFFFFF ;
scrollbar-darkshadow-color:#FFFFFF ;
}
※ご注意:scrollbarはIEしか実装されていません。

MyBlogListはCSS Class公開されていませんでした。
・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・・
■reference
BlogPeople

■TrackBack
■BlogPeopleリストをスクロール。[::SUNROOM:::さん]
BlogPeople リンクにスクロールバーをつける その2 -[PIROBLOGさん]
posted by KOu at 17:54 | Comment(8) | TrackBack(2) | ■blogTech
comment
トラックバックありがとうございます。

私のところは、スクロールバーはBODYで設定していたので、たった1行加えるだけで済んでしまいました。
魔法みたい!って思いましたよ(笑)。
Posted by sun at 2004.09.14 18:58
■sunさん
そうかぁ!BODYで一括設定してしまえば楽ですよね。

精進するっす。
Posted by KOu at 2004.09.15 10:05
こんにちは〜。
私、KOuさんは今までスクロールはお嫌いなのだと思いこんでました。
Posted by Candy at 2004.09.15 10:54
こんにちわ。

およっ?
何コレ?
便利そう!
難しいことまったく解らない私にも出来そうです^^
早速やってみますね
ありがとうございま〜す♪

(持ち逃げ)
Posted by メイ at 2004.09.15 10:55
■Candy さん
そんなことないっすよ。miniBBSでも使っていますし。
でも、デザインが変更できるのがIEだけっていうのがちょっと嫌かな。

■メイ さん
あっ!持ち逃げや〜〜〜!!
まて〜〜〜〜っ持ち逃げ〜〜〜〜

だれかぁ〜その持ち逃げつかまえて〜ぇ〜〜〜


くそっ!逃げられたか!




ってウソです。どうぞお持ち帰りくださいませ。

Posted by KOu at 2004.09.15 15:42
はじめまして。
スクロールさせる気なんてなかったんですけど、
予想外にカンタンなのでうっかり試しちゃいました。
なんだか知らない間にお世話になりましたm(_ _)m
Posted by ちゃっぴー at 2004.09.17 00:43
いや、これみんなどうしてるのかと思ってたのですよ。

早速わたくしめも持ち逃げいたしましょう。
Posted by 羊 at 2004.09.17 11:35
■ちゃっぴー さん
はじめまして。
いえいえ、うちはご紹介しただけですので…^^;
これはラクな方法ですよね。

■羊 さん
お久しぶりでございます。


あっ!羊がくわえて逃げた!

まて〜そこのひつじ〜ぃ
だれかぁ〜そのひつじ捕まえて〜ぇ


くそっ!逃げられたか!


(まっおきまりってことで)
Posted by KOu at 2004.09.17 12:00
comment
name :
url :

comment :
TrackBack URL


BlogPeople リンクをスクロール
Excerpt: 瞬きする間にできるくらいカンタンです。 CSSファイルに以下の1行を加えるだけ。 .blogpeople-main { overflow: auto; height: 400px; } まぢで..
Weblog: ちゃっぴーのひとりよがり
Tracked: 2004-09-17 01:02

やっと今週終わったぁ〜〜!!
Excerpt: 少し古い記事にTBしちゃってすいませんです; 私もスクロールバーつけてみました。
Weblog: あいこの書きたいホーダイ!
Tracked: 2004-10-16 22:50










最後まで読んでくれてありがとう!
そんなあなただけに、KOuからのとっておきトリビア!


トリビア司会者の後ろにある水槽の商品名は「アクアティックビジョンシステム」
×

この広告は90日以上新しい記事の投稿がないブログに表示されております。