FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか?

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[ --/--/-- --:-- ] スポンサー広告 | TB(-) | CM(-)

なんでもスクロールを横に2つ並べる

なんでもスクロールを横に2つ並べて表示する方法を紹介します。

公式プラグイン「フリーエリア」の中を下記の様にしてください。

<div style="
height:100px; /* スクロールの高さはこの数値を変えて設定してください */
width: 200px; /* 幅 */
float:left; /* 左寄せ */

overflow:auto;
scrollbar-3dlight-color:#ffffff;
scrollbar-arrow-color:#cccccc;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#cccccc;
scrollbar-shadow-color:#cccccc;
scrollbar-track-color:#ffffff;">

※スクロールさせる文字やプラグインのHTMLをここに加えてください。

</div>

<div style="
height:100px; /* スクロールの高さはこの数値を変えて設定してください */
width: 200px; /* 幅 */
float:right; /* 右寄せ */

overflow:auto;
scrollbar-3dlight-color:#ffffff;
scrollbar-arrow-color:#cccccc;
scrollbar-darkshadow-color:#ffffff;
scrollbar-face-color:#ffffff;
scrollbar-highlight-color:#cccccc;
scrollbar-shadow-color:#cccccc;
scrollbar-track-color:#ffffff;">

※スクロールさせる文字やプラグインのHTMLをここに加えてください。

</div>

<br style="clear:both" />


赤い部分が「なんでもスクロール」に新たに加えられた部分です。
幅はお好みに合わせて競ってしてください。
関連記事
[ 6258 ]
わざわざありがとうございます。
感謝します。
[ 2009/09/27 17:04 ] [ 編集 ]
[ 6265 ] > なゆたさん
お役にたてて良かったです。
[ 2009/09/27 21:56 ] [ 編集 ]
[ 6586 ]
3つ、4つ並べることはできるでしょうか・・・
[ 2009/10/21 17:14 ] [ 編集 ]
[ 6593 ] > 774さん
可能です。この記事の要領で<div>~</div>をいくつでも増やしてください。ただ1つ1つの幅は狭くする必要があると思います。

width: 200px; /* 幅 */
[ 2009/10/21 21:51 ] [ 編集 ]
[ 6838 ]
スクロールをひとつにして横に並べたいのですが、可能ですか?
もし可能でしたら方法を教えてほしいです。
お手数をおかけしまして申し訳ありません。
[ 2009/11/08 14:22 ] [ 編集 ]
[ 6845 ] > 7さん
スクロールの中身を2つ横に並べたいということでしょうか?
[ 2009/11/08 21:56 ] [ 編集 ]
[ 6849 ]
そういうことです。
分かりづらくてすみません。。
RSSを種類別に2つ横に並べたいのです。
[ 2009/11/08 22:37 ] [ 編集 ]
[ 6854 ] > 7さん
スクロールの中に入れたいものを、下記のようなタグで囲んでください。

<div style="width:280px; float:left;">
左の中身
</div>
<div style="width:280px; float:right;>
右の中身
</div>
[ 2009/11/08 22:57 ] [ 編集 ]
[ 6866 ]
すいません、なんか変なっちゃいました。。

あと↑を4つにすることはできますか。。
[ 2009/11/09 16:44 ] [ 編集 ]
[ 6878 ] > 7さん、コアさん
申しわけありません。さらに赤い部分を加えてみてください。

<div style="width:280px; float:left;">
左の中身
</div>
<div style="width:280px; float:right;>
右の中身
</div>
<br class="c-both" />
[ 2009/11/09 23:37 ] [ 編集 ]
[ 6880 ]
しつこくてすいません。なぜかRSSが表示されません

<div style="width:250px; float:right;"> の部分が
<div style="width:250px; float:right;> になってます。。

あとRSSを4つ表示するには・・・・
[ 2009/11/09 23:54 ] [ 編集 ]
[ 6882 ] > コアさん
ダブルクォーテーションが抜けてましたね。すみません;
4つ並べるならこうしてはどうでしょうか。

<table><tr>
<td style="width:25%;">中身1</td>
<td style="width:25%;">中身2</td>
<td style="width:25%;">中身3</td>
<td style="width:25%;">中身4</td>
</tr></table>
[ 2009/11/10 00:54 ] [ 編集 ]
[ 6884 ]
なるほどいろいろな方法があるのですね。。
%ですか。。

いろいろとありがとうございました。(^_^)
[ 2009/11/10 01:03 ] [ 編集 ]
[ 6888 ]
右と左のスクロール、両方のフォントサイズを変更したいのですがどうすればよいでしょうか?
テンプレートのスタイルシートのフォントサイズを変更しても左側しかフォントサイズが変更されなかったのですが。。。
[ 2009/11/10 07:30 ] [ 編集 ]
[ 6899 ] > コアさん、ショータさん
> コアさん
4つ並列に表示できましたね^^

> ショータさん
現状を確認するためにURLを教えてください。
[ 2009/11/10 22:41 ] [ 編集 ]
[ 6915 ]
申し訳ありません。
URLをURLの欄や本文などに入力すると 不適切なURLが含まれています。 と表示されてコメントすることが出来ないのです。
どうすればよろしいでしょうか?
[ 2009/11/11 01:49 ] [ 編集 ]
[ 6916 ]
上記の記事、コメント内容を見てなんでもカテゴリーを4つ

並べることは出来たのですがスクロールを1つにする事ができません

教えて頂けないでしょうか?
[ 2009/11/11 15:38 ] [ 編集 ]
[ 6927 ] > ショータさん、ra-kuさん
> ショータさん
ひょっとしてサーバーは8番でしょうか?いつのまにか禁止IPに「blog8.fc2.com」が含まれていたので解除しておきました。もう一度試してもダメなようならメールしてください。

> ra-kuさん
新たになんでもスクロールをダウンロードし、こちらのコメントの内容をその中に表示させてください。

http://10plate.blog44.fc2.com/blog-entry-313.html#comment6882
[ 2009/11/11 23:31 ] [ 編集 ]
[ 6967 ]
無事に4つ表示することが出来ました。

有難うございます^^
[ 2009/11/14 07:55 ] [ 編集 ]
[ 6979 ] > ra-kuさん
解決して良かったです^^
[ 2009/11/15 00:35 ] [ 編集 ]
コメントの投稿









管理者にだけ表示
※現在カスタマイズに関するサポートを休止中です。
表示が崩れる場合は表示が崩れる原因の調査手順をお試しください。
その他の問題はFC2ユーザーフォーラムにお問い合わせください。
トラックバック
この記事のトラックバックURL

ブログ内検索1
プロフィール

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
09 | 2016/10 | 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 31 - - - - -
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

09 | 2016/10 | 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 31 - - - - -
ユーザータグ


△ ページトップへ戻る
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。