image

  • フォト Amazonギフト券
    ※この時計の時刻は、閲覧しているパソコンのものであり、必ずしも正確な時間とは限りません

検索

最近のトラックバック

無料ブログはココログ

« ピックアップ:あんな内容でも勝ててしまう日本代表, Android ソースに Java からのコピペ発覚 オラクルとの訴訟に, etc... | トップページ | ピックアップ:日本ー韓国 走行距離試合データ, 後ろで踊りたがるノリノリの母と娘の仁義なき戦い, etc... »

2011-01-23

javascript の ダイアログでの focus 移動の実験。

<div> の dispaly:none, block の切り替えで実現させた ダイアログでは、TAB, Shift+TAB で focus 移動させると
ダイアログ外にも移動してしまう。

20110123dialog

そこで、ダイアログ表示中は、focus 移動はダイアログ中だけに制限するようにしてみた。
http://homepage2.nifty.com/youichi_kato/src/javascript/dialog/demo01.html

ダイアログ無し、ダイアログ表示中のそれぞれで TAB, Shift+TAB を押して focus 移動を試してみてほしい。
  (動作確認は firefox 3.5 on MAC OSX でしか行っていない)

大まかなアイデアは次のとおり。
ダイアログを開く時に ダイアログの <div> 要素の前後に <input> 要素を追加する。
後ろにつけた <input> に focus が移動してきたら、 ダイアログ中の最初の focus 可能な要素に focus 移動する。
前につけた <input> に focus が移動してきたら、 ダイアログ中の最期の focus 可能な要素に focus 移動する。

ダイアログ中の最初/最期のタグをきちんと探していないとか、
もっと汎用的な API にして plugin のようにするとか
すべき事は残っているが、上記のアイデアの概要実装はできている。

作成にあたり  http://code.google.com/p/jmpopups/ も参考にした。

« ピックアップ:あんな内容でも勝ててしまう日本代表, Android ソースに Java からのコピペ発覚 オラクルとの訴訟に, etc... | トップページ | ピックアップ:日本ー韓国 走行距離試合データ, 後ろで踊りたがるノリノリの母と娘の仁義なき戦い, etc... »

コメント

コメントを書く

(ウェブ上には掲載しません)

トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/184434/50669597

この記事へのトラックバック一覧です: javascript の ダイアログでの focus 移動の実験。:

« ピックアップ:あんな内容でも勝ててしまう日本代表, Android ソースに Java からのコピペ発覚 オラクルとの訴訟に, etc... | トップページ | ピックアップ:日本ー韓国 走行距離試合データ, 後ろで踊りたがるノリノリの母と娘の仁義なき戦い, etc... »

mokuji

2013年12月
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31        

google

  • twitter
  • __
  • _
    Googleボットチェッカー

合わせて読む

  • 合わせて読む
    フィードメーター - katoy: cocolog あわせて読みたい

リンク