Reload a gif image on a page load

Question

My website have a div with a gif image as background.

The gif animation will be played on the first loading. When page refresh or redirect to the home page from another page there will be no animation. I have to play the gif image whenever landing on home page. How can i reload the animation? Please anyone provide a solution.

Check the below link that may be useful to you. http://stackoverflow.com/questions/11455788/gif-animation-not-playing-on-refresh — user3497965, Feb 23 '15 at 06:35

score 0 · Answer 1 · answered Feb 23 '15 at 06:53

0

Use java-script cookies as flag variables to determine when to load the animation .gif accordingly.

answered Feb 23 '15 at 06:53

Chandim Sett

41
6

Zain Aftab · Answer 2 · 2019-07-10T07:31:41.730

Try using this code:

<style>
    #page-loader {
        position: fixed !important;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9999;
        background: #000 url(&#39;http://i.imgur.com/pKopwXp.gif&#39;) no-repeat 50% 30%;
        color: #FFF;
        display: none;
        font: 0/0 a;
        text-shadow: none;
        padding: 1em 1.2em;
    }
</style>
<script type='text/javascript'>
    //<![CDATA[
    $(document.body).append('<div id="page-loader">Loading...</div>');
    $(window).on("beforeunload", function () {
        $('#page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
    });
    //]]>
</script>

Change http://i.imgur.com/pKopwXp.gif to your image URL.

Reload a gif image on a page load

2 Answers2