簡モ：スクロールバーの応用

　簡単モード　

スクロールバーの応用

・下記サンプルの▼カラ▲マデを「コピー」して、

　簡単モードの投稿画面に「貼り付け」てから文章入力してください。

・スクロール枠のサイズ調整も行えます。（ □ をドラッグして調整します。）

＜　注意　＞

　　ＩＥ以外のブラウザには、反映しません。

■　スクロールバー　透明指定

※　サンプル　（コピーで使用可能です。）

▼

文章

▲

※　HTML　入力例

▼
<div style="overflow:auto;

scrollbar-arrow-color: none ;
scrollbar-face-color: #eeeeee;
scrollbar-track-color: #eeeeee;
filter:chroma(color=#eeeeee);
border:solid 1px #999999;
width:450px;height:150px;
font-size:12pt;color:#663333;
font-family:ＭＳＰゴシック;">
<div align="center">

<br>
文章

<br><br>
</div></div>
▲

scrollbar-arrow-color:     none   ;　　矢印（▼）の色を指定する。
scrollbar-face-color:      #eeeeee;　　透明指定により透明になる。
scrollbar-track-color:     #eeeeee;　　透明指定により透明になる。　　

filter:chroma(color=#eeeeee);　   　　　　透明にする色を指定する。

【注意】

文字や画像に透明指定と同じ色（#eeeeee）色が使用されていた場合は、文字や画像も透過処理されます。（画像は虫食い状態になります。）

■　スクロールバー　半透明指定

※　サンプル　：　不透明度70％　　（コピーで使用可能です。）

▼

文章

▲

※　HTML　入力例

▼
<div style="overflow:auto;
scrollbar-arrow-color: #ff0000;
scrollbar-face-color: #ffcccc;
scrollbar-track-color: #eeeeee;
filter:chroma(color=#eeeeee)alpha(opacity=70);
border:solid 1px #ffaaaa;
width:450px;height:150px;
font-size:12pt;color:#663333;
font-family:ＭＳＰゴシック;">
<div align="center">

<br>
文章

<br><br>
</div></div>
▲

scrollbar-arrow-color:　 #ff0000;　矢印（▼）の色を指定する。
scrollbar-face-color:　　　#ffcccc;　スクロールバーの表面の色を指定する。

scrollbar-track-color:　　 #eeeeee; 透明指定により透明になる。

filter:chroma(color=#eeeeee)alpha(opacity=70);　透明にする色を指定する。

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　不透明度(%)を指定する。(0～100）

スクロールバーだけの半透明ができなかったー

【注意】

文字や画像に透明指定と同じ色（#eeeeee）が使用されていた場合は、文字や画像も透過処理されます。（画像は虫食い状態になります。）

スクロールバー内の文字や画像、全てが半透明になります。

ＨＴＭＬの作成方法

Ｆｉｌｔｅｒの機能説明

無断使用は、ご遠慮ください。

既に使用されている方もおられますが、記事に上げておきます。

Chｒｏｍａの別の使い方を試していますが、上手くいってません。

スクロールバーでは上手く反映しているのに、

別の場所に指定した場合、反映しないのはなぜだ～～～。

指定方法が間違っているのかなー？

出来そう思えたのに出来ないよ～～～～。