Firefoxのmoz-iconを使ってみる

投稿者: shuichi, タグ: ,,, 投稿日時: 2005/10/13 03:19

Firefoxのロケーションバーに

moz-icon://.txt?size=32

と入力してみてください。テキストファイルのアイコンが表示されると思います。今回はこれを利用します。PDFファイルへのリンクを見分ける方法はいろいろありますが、ここでmoz-iconを使ってみます。

a[href$=".pdf"]:before
{
	content: url( "moz-icon://.pdf?size=16" );
	vertical-align: middle;
}

これをuserContent.cssに追加するとPDFファイルへのリンクにPDFアイコンが表示されます。同様に.doc、.xls、.ppt、mailto:に対してもアイコンを表示させてもいいかもしれません。

次にhail2u.netさんのFirefoxのuserChrome.cssネタ #10にてBookmarkletのアイコンを変える方法が載っていますが、これを参考にしてアイコンをJavaScriptファイルのアイコンに変更してみます。こちらはuserChrome.cssに追加してください。

.bookmark-item[statustext^="javascript:"]
{
	list-style-image: url("moz-icon://.js?size=16") !important;
}

また、以下のように実行ファイルのアイコンを表示することもできます。ちなみにFirefoxの拡張のLaunchyはこの方法でプログラムのアイコンを表示させています。

moz-icon:file:///c:/windows/explorer.exe?size=32

ページ内検索バーをタブバーの上に表示した時に違和感を低減する

投稿者: shuichi, タグ: ,,, 投稿日時: 2005/10/12 01:14

またまたuserChrome.cssネタです。Firefoxまとめサイトにはページ内検索バーをタブバーの上に表示する方法が載っています。これに従って検索バーをタブバーの上に表示させると周りの見た目と微妙に違いますよね。そこで以下のコードをuserChrome.cssに追加することで多少は違和感が低減すると思います。

#navigator-toolbox
{
	-moz-box-ordinal-group: 1;
}
#browser
{
	-moz-box-ordinal-group: 3;
}
#FindToolbar
{
	-moz-box-ordinal-group: 2;
	-moz-appearance: toolbox !important;
}
#status-bar
{
	-moz-box-ordinal-group: 4;
}

Firefoxのブックマークツールバーのアイコンを非表示にする(ついでにドロップメーカーを表示)

投稿者: shuichi, タグ: ,,, 投稿日時: 2005/10/11 00:13

またuserChrome.cssネタです。Firefoxのブックマークツールバーのアイコンを非表示にするにはuserChrome.cssに以下のコードを追加します。

#bookmarks-ptf .bookmark-item > .toolbarbutton-icon
{
	display: none;
}

アイコンを非表示にするとブックマーク項目とフォルダが見分けがつかないので、フォルダにドロップメーカーを表示します。

#bookmarks-ptf .bookmark-item > .toolbarbutton-menu-dropmarker
{
	display: -moz-box !important;
	padding: 3px;
}

marginとpaddingは適当に調整します。

Firefoxのツールバーボタンの文字をアイコンの右側に表示させる

投稿者: shuichi, タグ: ,,, 投稿日時: 2005/10/10 11:45

Firefoxのツールバーボタンの文字はアイコンの下に表示されますが、これをInternet Explorerのように右側に表示させてみたかったのでuserChrome.cssをいじってみました。基本的には以下のコードをuserChrome.cssに追加してFirefoxを再起動すると反映されると思います。

#navigator-toolbox .toolbarbutton-1, #navigator-toolbox .toolbarbutton-menubutton-button
{
	-moz-box-orient: horizontal !important;
}

ただ、Firefox拡張のLaunchyやメールのツールバーボタンは構造が異なり反映されませんが、ツールバーボタンのアイコンと文字を格納しているxul:box要素のorient属性の値をhorizontalに変更するといけるっぽいです。