hynemossの日記

2010-02-10

Opera 透過スキンの手引き

18:01

skin.ini の各セクションに以下を追加することで、その領域が透過される。

ClearBackground = 1

ただしそのセクションで画像を指定している場合は透過の上に画像がくるので透過にはならない。

半透過の png 画像を指定している場合はもちろん半透過される。


以下、Aero 環境の場合のみ適用されるセクション

[Pagebar Transparent Skin] タブバー
[Drag Scrollbar Transparent Skin] サムネイルタブ有効時のドラッグ領域
[Toolbar Transparent Skin] ツールバー(いろんなとこに使いまわされる)
[Mainbar Transparent Skin] メインバー
[Personalbar Transparent Skin] パーソナルバー
[Statusbar Transparent Skin] ステータスバー
[Statusbar Head Transparent Skin] ステータスバーの左側領域
[Statusbar Tail Transparent Skin] 同じく、右側領域
[Addressbar Transparent Skin] アドレスバー

これらは Aero 環境以外では適用されないから互換性が保てる。

10.50 の仕様がまだ固まりきってないから変更あるかも、随時書き換える予定。


さらに全透過スキンにする場合、以下を追加する。

[Options]

Full Transparency = 1

前述の通りこれをすると Aero 環境以外では指定要素なしのスキンとなる。

アドレスバーの透過はこれをしとかないと挙動がおかしい現状。

あとは透過したい領域で ClearBackground を有効にすればおk


Opera 側で opera:config#UserPrefs|DebugSkin を有効にしておけば

マウスオーバーでスキンの情報が表示されて領域の特定が少しだけ楽、少しだけ・・・。

Opera skin.ini with images にはいつもお世話になってます。この場を借りて、お礼申し上げます。


全透過スキンでおもしろいのはスピードダイヤルまで透過できちゃうこと。

こんな感じに書くと、

[Speed Dial Widget Skin]

ClearBackground = 1

こうなる。


f:id:hynemoss:20100208021432p:image:w600

IBIS inspire Transparent(追記:100212)


透過スキンの弊害

・画像の通り、なんかフォント色が所々おかしい。2バイト文字に限るかも。 → 原因分かった:Opera 10.50 透過スキンの文字色指定

[最小化][最大化][閉じる] Vista では完全に無反応、7 ではマウスオーバーが反応ない現状。 → build 3273 で修正

・背面ウィンドウによっては文字が見えづらくなる。


UI としては何一ついいことないと思うんだ。

でも何よりかっこいいよね!

結構簡単だからあなたもお気に入りのスキンを透過しちゃえばいいと思うよ!


追記:100212

スキンだけじゃなく画象の背景も透過する CSS があるらしい。全透過スキンの先駆者 Z1 さん、すごいっす!

Transparent background when viewing pictures with Z1-Glass


suehiro さんが 10.50beta 用を公開してくれてました。うれしいでうs!

Opera skin.ini with images for 10.5


追記:100213

ClearBackground = 1 をするとき注意しないといけないことを書くの忘れていた。

現状、メニューバー( skin.ini の [Menu Skin] )は透過できない。

仮に ClearBackground を有効にすると、メニューバーを表示すると Opera落ちる。 → いつの間にか修正されてた、もう問題ない。