このサンプルはわざとセンター合わせの動的なメニュー位置になっています。
そのメニューにカーソルが乗るとサブメニューが表示されます。

■このサンプルの流れ
メニューが静的な位置であれば、動的に取る必要が無いですが、 ブラウザ間のCSS適用の違いなどを吸収させる為にJavaScriptでも補助させておく方が無難です。
静的な場合でJavaScript補助を付ける場合なら、ページオンロードの時に一度位置を取得して、 それを設定してしまえば位置取り機能の出番は終わりです。
あとは表示非表示をコントロールすればOK。

このサンプルの様にセンター合わせにすると、半動的な位置情報が必要になります。
完全な動的ではなく、オンロード時とウィンドウリサイズ時のみ位置情報を取得して設定すれば良いので 半動的な位置情報といえます。
マウスオーバーする度に位置情報を取るようにしても問題はありませんが、 位置情報が必要なのはオンロード時とリサイズ時のみに限定できますので、 マウスオーバーする度に無駄な処理を行う必要はありません。 あとは、マウスオーバーで表示・非表示をコントロールしてるだけです。

余談です
サブメニューからカーソルが外れると非表示にしていますが、 これはマウスアウトを使っていません。 『マウスが外れたら』＝ マウスアウト と言う考え方は安直過ぎです。
詳しくはスクリプト内の方にコメントをつけています。