Internet Explorer 系のブラウザではスクロールバーの色替えをスタイルシートで指定することが出来る。 これについては各種の html / CSS 講座やブログ改造講座でも講義されている。
ところが「透過」となると多くの講座で扱わないようだ。 勿論「訳あり」と言うことになる。
文書型宣言
「いきなり何だ!」と思われるかも知れないが、「透過」と無関係ではない。
殆どのブログで宣言されているが、「標準モード」と「互換モード」に分けられる。
「標準モード」とは「W3C の標準的仕様に準拠した」と言う意味で、dtd ファイルの指定をするようになっている。
指定はブログによってマチマチであるが、テンプレートで替えている場合もある。
- html 互換モード
- Cocolog、Yaplog
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> - html 標準モード
- Goo、Ninja、Petitmall
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> - xhtml 互換モード
- FC2
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> - xhtml 標準モード
- Excite、Jugem、Livedoor、Teacup
- 宣言無し(互換モード)
- Amigio、Net4u、Oricon
標準モードでは「透過」に filter: chroma(color=色指定); をスタイルシートで指定する必要があるが、これをサポートしていないので働かない。
それでは「互換モードに変更すれば」という発想になるが、スタイルシートの解釈や javascript にも影響することがある。
訪問者に優しいWebサイト作り とか スタイルシートの使い方【ブラウザ互換について】 が勉強になるでしょう。
実行の前に
前述のように IE 系以外のブラウザでは、「スクロールしない、スクロールバーを付けない」(html, body: {overflow: hidden} や <body scroll="no">)とし、擬似フレームにスクロールバー透過を指定しても働かないので、下の記事を読めない、サイドバーの下の部分を見られないといった事態が起こり得る。
ブラウザによっては記事部分をドラッグしてスクロールすることも出来たりするが、特に xhtml の場合にはそれさえも働かなくなる。
だから万人の来訪を期待するなら、ページ・スクロールバーの透過はしてはいけないと言ってもよい。
どうしてもこだわるなら、「IE 推奨」ではなく、IE 以外の来訪の時にはアラート(警告)を表示するくらいでもいいと思う。
チェコ語で「北」を意味します。