image

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

検索

最近のトラックバック

無料ブログはココログ

« 2011年1月20日 | トップページ | 2011年1月26日 »

2011年1月23日

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...

- http://www.jsports.co.jp/press/column/article/N2011012301182702.html
> J SPORTS|コラム 【後藤健生コラム】あんな内容でも勝ててしまう日本代表

- http://d.hatena.ne.jp/next49/20110122/p2
> 妄想:会社がコミュニケーション能力を求める理由 - 発声練習

- http://japanese.engadget.com/2011/01/22/android-java/
> Android ソースに Java からのコピペ発覚、オラクルとの訴訟に影響か

- http://www.lifehacker.jp/2011/01/110120_cancelshutdown.html
> Mac OS Xのシャットダウンをキャンセルする超簡単な裏技 : ライフハッカー[日本版]

- http://labaq.com/archives/51578873.html
> らばQ:こんな風になっていた…銃から弾丸が発射される瞬間の写真いろいろ

- http://www.yukawanet.com/archives/3361467.html
> 自然の驚異を感じる、「アリの巣の全貌」を明らかにした映像|| ^^ |秒刊SUNDAY

- http://blog.goo.ne.jp/mithrandir9/e/5d8249376ac2592288a873dcbf11e412
> BBC「QI」の出演者たちは実際に何を言っているのか? これが「被爆を嘲笑」? - 水川青話

- http://accelerated-afterimage.com/2011/01/sony-reader-%E3%82%921%E3%83%B6%E6%9C%88%E4%BD%BF%E3%81%A3%E3%81%A6%E3%81%BF%E3%81%9F%E6%84%9F%E6%83%B3/
> SONY Reader を1ヶ月使ってみた感想 - 加速する残像

- http://blog.livedoor.jp/himasoku123/archives/51591203.html
> 暇人\(^o^)/速報 : だまし絵の魅力 - ライブドアブログ

- http://www.ritsumei.ac.jp/~akitaoka/
> 北岡明佳の錯視のページ

« 2011年1月20日 | トップページ | 2011年1月26日 »

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 あわせて読みたい

リンク