window.resize

今回はＷｅｂページを作るサーバーサイドの話題です。

ブラウザでＷｅｂページを見ている時に、マウスなどでウインドウのサイズを変更すると window.resize イベントが発生します。イベントハンドラは新しいウインドウに合わせて画面レイアウトを修正したりするわけです。今作成中の版では、ウインドウ幅によって表示を変更するようにしているのですが・・・

画面表示を変更するにはページを作り直すのが簡単。ウインドウの大きさを変更なんて操作はさほど頻繁ではないし。と言う訳で、同じページを単純に再作成するようにしました。ＤＢを検索なども全部再実行。場面によっては結構重いけど、まあいいか。

ところが、ウインドウのサイズを変更していないにもかかわらず resize イベントが発生する事がありました。ページを移動すると、そのページが２回作成されてしまいます。それも全ページで。

https://www.infoscoop.org/blogjp/2015/02/27/ie8-window-resize/　に情報がありました。DOM の高さを変更すると resize が発生するのだそうです。回避策も書いてありました。resize のイベントハンドラで「本当にサイズが変わっているか」を調べ、変わっていない場合はイベントは無視する、というものでした。

あまりスマートではないと思うけど、他に方法がないのでは仕方がない。サイズの検査の数行を追加してＯＫになりましたが、なぜ２回実行されるのかが判るのに２日かかってしまいました。やれやれ。だけど、良かった、よかった。