Operaの備忘録のぺえじ

 | 

2009-08-11

[]maximize-image.js

Autosizerライクな画像閲覧補助用のユーザーJSです。

ダウンロード

http://misttrap.s101.xrea.com/arc/maximize-image.js

基本的な使い方

画像ファイルをOperaで開いて(ウェブ・ローカルを問いません)、画像をダブルクリックしてください。画面いっぱいに収まるように画像が拡大、もしくは縮小されます(本文章ではこれを「最大化」と呼んでいます)。もう一度ダブルクリックすると元の表示に戻ります。

設定を変更する

JSのテキストの上部にあるいくつかの変数の値を書き換えることによって、最大化に関する初期設定を変更することが出来ます。

DIRECTION_TO_FIT
画像を最大化する際に基準とする方向を決めます。"1"は水平方向のみ、"2"は垂直方向のみ、"0"は両方向、"3"はどちらか短い方向のみをチェックして画面内に収まるようにします。
MAXIMIZED_START
この値をtrueにすると、あらかじめ最大化された状態で画像を開きます。
SHRINK_ONLY
この値をtrueにすると、画面より小さい画像に対する拡大は行われず、画面より大きい画像の縮小のみとなります。

キー入力による操作

2010/10/04時点でのキーアサインの一覧です。

入力キーアクション
"d" or "D"最大化表示を解除する
"m" or "M"水平・垂直の両方向を基準にして最大化する
"h" or "H"水平方向のみを基準にして最大化する
"v" or "V"垂直方向のみを基準にして最大化する
"u" or "U"水平・垂直のどちらか短い方向のみを基準にして最大化する
"e" or "E"拡大処理を含む最大化を実行する
"s" or "S"縮小処理のみの最大化を実行する
"l"(小文字のエル) or ","背景色の赤要素を1ずつ増加/減少(シフトキー押下で10ずつ)
";" or "."背景色の緑要素を1ずつ増加/減少(シフトキー押下で10ずつ)
":" or "/"背景色の青要素を1ずつ増加/減少(シフトキー押下で10ずつ)
"]" or "\"画像の透明度を0.1ずつ増加/減少

仕様

  • 最大化していない状況でのことなんですが、開いた画像の横幅が描画領域より大きくて高さが描画領域より小さいと余計な縦スクロールバーが出てきます(横スクロールバーの高さを勘定に入れていないため)。これをなんとかするためのコードも入っています、というかこれをなんとかするのが最初の目的でした。バージョンアップで改善されたようなので該当部分を削除しました。
  • 特定の最大化設定は画像のサイズを計測して動的にCSSを付与しているので、計測に失敗すると正しく最大化されないという事態になります(画像のサイズは開いた直後に取得できる場合が多いのですが、ファイルサイズが大きいと失敗することがあるようです)。これを回避するために、画像ロードが完了するまでは画像サイズを100msごとに計測しなおしています。このタイマー処理が重く感じる場合は、設定を「原寸表示」「拡大ありX軸フィット」「縮小のみXY軸フィット」のいずれかに変更してみてください。これらは静的CSSで解決されているためタイマーが回りません。
 |