FC2ブログ

Seasonism Season2 ~ナヲキの想うところ~

清く正しく美しいヘンタイに――
INDEX | BBS | HOME

--年--月--日 ---:---

拍手ボタン■スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

2010年02月12日 -18:30-

拍手ボタン■Firefoxでページ全体のスクロールバーだけ左側に
ページ内全てのスクロールバーを左に表示するのはいろんなとこで解説されてますが、ページ全体のスクロールバーだけを左に表示する方法は見つからなかったので、自分で作ってみました。

なお、以下の説明ではStylishとGreasemonkeyを利用していますが、他のものでも代替可能です。


まずStylishで以下のスタイルを作成します
body { direction : rtl !important ; }
body * { direction : ltr !important ; }


次にGreasemonkeyで以下のユーザースクリプトを作成します
// ==UserScript==
// @name left-scrollbar
// @namespace nawo
// @include *
// ==/UserScript==

var div = document.createElement("DIV"),
body = document.body;
while(body.lastChild)
div.insertBefore(body.lastChild, div.firstChild);
body.appendChild(div);


最後にabout:configで
user_pref("layout.scrollbar.side", 1);

と設定します。

これで全てのWebページが、ページ全体のスクロールバーのみ左側に表示される状態になりました。


~解説~
『direction:rtl;』は、テキストを右から左に読むという意味で、主にアラビア語圏のページで見られるプロパティです。
これを指定してしまうと、デフォルトで左寄せだったものが全て右寄せになり、文末の句読点が文頭に持ってこられます。
同様にスクロールバーも左側に表示されます。
(通常はdirection:ltr;になっている)

『layout.scrollbar.side=1』は、directionの宣言にあわせてスクロールバーを表示するというもの。
(通常は強制的に右側に表示される。layout.scrollbar.side=3だと強制的に左側に表示される)

body全体にdirection:rtl;してしまうと、表示がおかしくなるので、body直下をdivで囲い、そのdivにdirection:ltr;を掛けて元に戻しています。
そのbody直下をdivで囲うという動作をGreasemonkeyのユーザースクリプトが行っています。


~弊害~
ページ全体のスクロールバーのみ左側に表示され、それ以外のスクロールバーの位置は保持されるため、なにがなんでもスクロールバーを左側に表示してしまうよりも、自然な閲覧が可能です。

ただし、ごく一部 (たとえばJavaScriptで特殊な入力フォームを表示していたり) で、direction:rtl;の指定が優先されてしまうことがあります。
また、画面の横幅を超えてコンテンツが表示されているとき、横スクロールのバーが少しおかしくなります。
この場合はステータスバーから一時的にStylishの当該スタイルを無効にすることで、元に戻せます。

この弊害の原因がわからないので、回避する方法がわかれば教えてください。


追記:
予想していたけど、やっぱりdivの階層だけでスタイルを適用しているサイトで表示に不具合が出ました。
Gmailの表示がおかしくなったのが致命的。大丈夫だと思ったのになぁ……
スポンサーサイト

■コメント

■コメントの投稿

管理者にだけ表示を許可する
※英字のみのコメント・トラックバック、言及リンクのないトラックバックは、スパム対策の関係上、自動削除されます。

<< さ○らのレンタルサーバーラ○トでWordPressを動かす | Blog TOP | 迷惑メール除去 >>

プロフィール

ナヲキ

Author:ナヲキ


twitter
著作権について

携帯へのURL転送

QRコード

ブロとも申請フォーム

ブログ検索

カレンダー

12 | 2019/01 | 02
- - 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 - -

最近のコメント

データ取得中...

最近のトラックバック

管理用

WEBコンサルティング joomlaでホームページ制作 ブログパーツ制作
Copyright(C) 2007 ナヲキ. All rights reserved.
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。