技 巧 鍵 盤 ─ KeyNavi:キーボードを活用してホームページを快適に─    
キー割当表示[Shift-H]        
ホーム KeyNavi対応方法 [0] JavaScript@Keynavi.Netトップ [1] 動的にレイヤーの中身を書き替え&URLロード ・サイトマップ [Shift-S]

■ 動的にレイヤーの中身を書き替え&URLロード:kl_layer_write/load()

レイヤー内で表示されているHTMLを変更できます。 Netscape4.xでは「e.document.write()」、 それ以外では「e.innerHTML」を使います。

【レイヤーの中身を書き替え:kl_layer_write()<keynavi_tools.js】

function kl_layer_write(id,s,ns4){
        return kl_replace(id,s,0,ns4);
}
function kl_replace(id,s,mode,ns4){
        var e=kl_getelem(id);
        if(!e) return 0;
        if(KL_NS4){
                if(!ns4) return 0;
                e.document.open(); e.document.write(s); e.document.close();
                return 1;
        }
        if(!kl_isstr(e.innerHTML)) return 0;
        if(mode=="append") e.innerHTML=e.innerHTML+s;
        else if(mode=="prepend") e.innerHTML=s+e.innerHTML;
        else e.innerHTML=s;
        return 1;
}

Netscape4.xでは「position:relative」としたレイヤーでは不安定です。 「position:absolute」としたレイヤーに実行するようにします。

レイヤーで表示している外部ページのURLを変更します。 Netscape4.xでは「e.load()」、それ以外ではiframeのURLを変更します。

【指定URLを読み込み:kl_layer_load()<keynavi_tools.js】

KL_LAYER_NEW_I2W=new Array();
function kl_layer_load(id,url,ns4){
        var e=kl_getelem(id); if(!e) return 0;
        if(KL_NS4){
                if(ns4){
                        //NS4では横幅を指定する必要があります
                        e.load(url,e.clip.width ? e.clip.width : 200);
                        return 1;
                }
                return 0;
        }
        if(e.setAttribute){ e.setAttribute("src",url); return 1; }
        if(!KL_LAYER_NEW_I2W[e.id]) return 0;
        self.frames[KL_LAYER_NEW_I2W[e.id]].location=url;
        return 1;
}

これらの利用例については動的にレイヤーを作成:kl_layer_new() を見てみてください。

タイマー機能を簡単に利用:kl_timer_...() の例では文字列が動的に追加されていきます。




【JavaScript@Keynavi.Net : レイヤー編:応用 】
「Ctrl-矢印」でフォーカスを上下左右に移動できます。

  - レイヤーをウィンドウ内の中心位置に固定
  - 動的にレイヤーを作成:kl_layer_new()
  - 動的にレイヤーの中身を書き替え&URLロード:kl_layer_write/load()
  - 半透明レイヤー:kl_tlayer_new()
  - レイヤーのドラッグ設定・解除:kl_drag_set()
  - レイヤークリックで手前に移動:kl_raise_set()

トップへ戻る [1]
ホーム KeyNavi対応方法 [0] JavaScript@Keynavi.Netトップ [1] 動的にレイヤーの中身を書き替え&URLロード ・サイトマップ [Shift-S]
キー割当表示[Shift-H] ─ KeyNavi Project 2003 ─