ロールオーバーや先読みでgifアニメがおかしくなる件


IE7以上で1回のみのgifアニメが終わっていたり、
ループのgifアニメが途中から表示されてしまうときがあります。

解決法

先読みを止める。
先読み(ロールオーバーのJSにも含まれていることがあります)によって、(ロールオーバーする前でも)画像を読み込んだ瞬間からgifアニメが動いてしまっておかしくなってしまいます。

しかしこれだとIE11が動かない・・・

ロールオーバーの画像がgifアニメ(繰り返さない)のとき、ロールオーバー2回目から最後のコマしか表示されなくなった。
JavaScriptでGIFアニメーションを繰り返し読み込むときの注意点 | iwb.jpを参考に、ロールオーバー時の画像にクエリーを付けたら動いた。

ロールオーバー時画像パス
↓
ロールオーバー時画像パス+ '?' + (new Date).getTime()

全ブラウザこれでいけるか?と思ったら、Firefoxの挙動がおかしい

[JavaScript] Memo, IE 10, IE 11を判別するnavigatorプロパティ - userAgentを使わずに « イナヅマTVログを参考に、IE11のみ分岐

ロールオーバー時画像パス+ '?' + (new Date).getTime()
↓
var is_ie11 = !!window.navigator.pointerEnabled; //IE11かどうか
if(is_ie11) { //IE11のみ
    ロールオーバー時画像パス+ '?' + (new Date).getTime()
} else { //それ以外
    ロールオーバー時画像パス
}