JavaScriptを使用した画面ロックの仕組み。
以前入ってたプロジェクトでこんな感じので結構よさそうなのが
あったんだけど仕組みは理解しないまま抜けてしまって、
でもあれよかったので改めて調べてみました。

予想通りz-indexを使用してました。
ざっくり説明すると、divをcreateElementして幅をbodyの
最大幅に設定してあとはそのdivにスタイルシートを適用した後に
z-indexを最前面に持っていく。
すると作ったdivのせいで背景となってしまったメインフォームが
触れなくなるという感じ。

onresize, onscrollにもハンドルする事でウィンドウサイズを
変えられても大丈夫。
ポイントは適用するスタイルシートの設定で
filter:alpha(opacity=30)という指定をしておくと
半透明化できるらしい。
このdivの上にイメージを置けば前のプロジェクトの
再現って感じかな。

でも問題はこれを適用する為の枠組みを作る事の方かな。
（枠組みの）利用者側がこれを意識して呼ばなければ
ならないといけないとかだと手間がかかるから上手く包括する
枠組みを作ってその上に利用者側の実装を載せるようにしないと。