もんたメソッド

404 Blog Not Found:javascript+CSS - お手軽もんたメソッドで、簡単に「もんたメソッド」を実現する方法が紹介されていた。なかなか面白いし確かにかなりお手軽なのだが、この方法だと以下のような問題がある。

• スクリーンリーダーを使っているとクリックしなくてもネタバレしてしまう
• CSSが有効で Javascriptが無効だと、秘密は秘密のまま

スクリーンリーダーの場合、少なくとも今出回っている物の実装では、表示色に関係なくページの内容を読み上げるようになっているので、背景色と表示色を同じ色にするだけでは、見かけ上は表示されていなくても読み上げられてしまう。そこで、スタイル指定で visibility: hiddenを使おうと思ったのだが、これをやってしまうとクリックする対象の要素が表示されなくなってしまって、 (やり方が悪いだけかもしれないが) クリックできなくなってしまった。そこで仕方なく、今のような形にしてみた。

二つ目の問題は、最初は全てを表示するようにしておいて、 Javascriptがロードされた時に表示が消えるようにしてやればすむ話だと思う。

自他共に認める javascript超初心者の僕の苦労の結果がこのページなのだが、なぜか Firefoxではちゃんと動作してくれないようだ。それに、もっとスマートな書き方もありそうな気がする。そんなわけで、添削大歓迎です。