技 巧 鍵 盤 ─ KeyNavi:キーボードを活用してホームページを快適に─    
キー割当表示[Shift-H]        
ホーム KeyNavi対応方法 [0] JavaScript@Keynavi.Netトップ [1] フォーカスするウィンドウの切替え ・サイトマップ [Shift-S]

■ フォーカスするウィンドウの切替え

一般に全てのキー入力は現在フォーカスされているウィンドウに対して行われます。 KeyNaviの機能も フォーカス中のウィンドウに対して有効です。
フレームを使った複数のウィンドウから成るページでも同様です。

さて、Windowsでは「ALT-Tab」「ALT-Shift-Tab」によって フォーカスするウィンドウを順番に切り替えられます。

JavaScriptを使い、フレームで それと同じ機能を実装することが出来ます。 「WinObj.focus()」によって「WinObj」をフォーカス することができます。

【前後のフレームにFocusするサンプル】

<script language="javascript"><!--
//--------------------------------------------
//「self」を包含するフレームObject全てを配列として返す
// (再帰的にkl_frames()呼出し&ウィンドウの使用可否をCheck)
//--------------------------------------------
function kl_frames(win,v){
        if(!v) v=new Array(); if(!win) win=top;
        if(kl_closed(win)) return v;
        for(var i=0;i<win.frames.length;i++){
                if(!kl_closed2(win.frames[i])) v[v.length]=win.frames[i];
                else v=kl_frames(win.frames[i],v);
        }
        return v;
}
//--------------------------------------------
//「inc=-+1」で前後のフレームにFocusする
//--------------------------------------------
function focus_next(inc){
        var fs=kl_frames();
        for(var i=0;i<fs.length;i++){
                if(fs[i]==self){
                        fs[(i+inc)%fs.length].focus();
                        break;
                }
        }
        return;
}
//-->
</script>

KeyNaviにおける複数Windowフォーカス制御

KeyNaviの「Ctrl-I/K/J/L」によるフォーカス移動では フレーム間でもフォーカスを移動できるようにしています。

また複数の独立したウィンドウがある場合は 「KL_FWIN_LEFT/RIGHT」の指定があれば 左右にフォーカスしきれなくなった時に指定したウィンドウに フォーカスを移動できます。

上を実行すると新しいウィンドウが開きます。 表示がなされたら下記を実行。

注:self["winObj"]
上の実行フォームではJavaScriptのeval()を呼び出しています。 eval()の実行で変数「winObj」を「self」の名前空間で 共通に利用できるよう「self」を使っています。 通常のJavaScriptでは普通に「winObj」とすればOKです。

「Ctrl-JL」によって左右にフォーカスを動かします。 フォーカスしきれなくなるともう片方のウィンドウに フォーカスが移動します。

これにより フォーカス移動にマウスが不要になり、 キー入力のみで複数ウィンドウの操作が可能です。

これにより 複数窓の扱いが楽にならないかと 期待しています。



【JavaScript@Keynavi.Net : ウィンドウ編 】
「Ctrl-矢印」でフォーカスを上下左右に移動できます。

  - ウィンドウサイズ取得:kl_windowwidth/height()
  - スクリーンサイズ取得:kl_screenwidth/height()
  - ウィンドウの使用可否判定:kl_closed()
  - フルスクリーン:kl_fullscreen(url,name)
  - フォーカスするウィンドウの切替え

トップへ戻る [1]
ホーム KeyNavi対応方法 [0] JavaScript@Keynavi.Netトップ [1] フォーカスするウィンドウの切替え ・サイトマップ [Shift-S]
キー割当表示[Shift-H] ─ KeyNavi Project 2003 ─