こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

IPHONEでのクリッカブルマップ

PCサイトを作成していて ommouseover/onmouseout を使ってリンクボタンを作成しました。
このサイトをスマホで開くとアンドロイドは問題ないのですが。IPHONEで開くとそのリンクボタンを触ってリンク先には飛ぶのですが、そのページに戻ってきたときにリンクボタンに触った状態の画像のままになってしまいます。何か対処できる方法はないでしょか。

overで(1)の画像になって
outで元の画像が表示されますが
リンク先から戻ってもoverの(1)の画像がでてしまいます

投稿日時 - 2016-07-27 22:54:10

QNo.9207523

困ってます

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

ANo.1

(クリッカブルマップ ではなく ロールオーバーのことだとは思いますが)

その現象は、前ページに戻ったときにキャッシュを表示しているからなので
戻ったというイベントを見つけて、onmouseoutと同じ処理を行わせればよいことになります。


window.onpageshow = function(event) {
 if (event.persisted) {
  var tempEle = document.getElementById("xxx");
  if ( tempEle ) tempEle.src = "img/xxxx.jpg";
 }
};

もしくは、ページごと強制リロードさせるかです。
(その分、サーバー負荷やトラフィックは増えますが)
window.onpageshow = function(event) {
 if (event.persisted) {
  window.location.reload();
 }
};

(このサイトは インデントが崩れるので、全角空白つかってインデントさせています)

投稿日時 - 2016-07-28 10:27:07

あなたにオススメの質問