みかづきブログ その3

本ブログは更新を終了しました。長年ありがとうございました。

👆

引越し先はこちらです!

Androidでは初期状態が display:none; のgifアニメが動かない時があるらしい

本日遭遇しました。
displayをblockにしたあとにbackground-imageのurlのパスにタイムスタンプをつけることによって解決しました。
この方法では、レンダリングが2回走ることになり、サイズの大きなgifアニメだと一瞬消えてしまうので注意が必要です。

JavaScript

$(".gif").fadeIn(function() {
    var $this = $(this);
    
    $this.css({
        backgroundImage: $this.css("background-image").replace(/\)/, "?date=" + (new Date() - 0) + ")")
    });
});

DEMO