IEのブラウザバック時にマウスオーバーが維持されてしまう

Question

IE11にて、ブラウザの「戻る」ボタンを使用した時の事です。
前に展開したCSSのメニューが展開されっぱなしになっているのを、きちんと仕舞いたいです。

以下の手順で発生しました。
0. CSSで作成した階層付きのulのメニューをマウスオーバーで展開し、子項目のリンクをクリック
0. リンク先の画面で、ブラウザの「戻る」ボタンをクリックし、1の画面に戻る
0. メニューが展開されたままになっている

手順１と３は同じ画面です。
３の画面では、１の画面から２の画面に遷移する直前の状態が維持されているような感じです。

理想の状態としては、手順３の時に、子項目が表示されないことです。
FirefoxやChromeでは起きませんでしたが、IEでは仕方ないことなのか、それとも対策があるのか分からず悩んでいます。
ヒントを頂けたらと思います。よろしくお願いします。

Answer 1

マウスオーバーを出すためのCSSクラスを、リンククリック時にスクリプトではずしてしまってはいかがですかね。
そうするとブラウザバックで戻ってきたときにメニューが動かなくなりますので、onmouseoverイベントかなんかでCSSクラスをセットし直すようにしておけばよろしいかと。

Comments

[qazwsx]

yuba様
おかげさまで解決しました！！ありがとうございました！！
参考サイト：http://qiita.com/glaytomohiko/items/e3b784d7ee7f6b8a8e16