is there any way to add gifs to the title bar?

If you want it to work on most browsers, you need to “manually” switch the images

var favicon_images = [
                    'http://website.com/img/tmp-0.gif',
                    'http://website.com/img/tmp-1.gif',
                    'http://website.com/img/tmp-2.gif',
                    'http://website.com/img/tmp-3.gif',
                    'http://website.com/img/tmp-4.gif',
                    'http://website.com/img/tmp-5.gif',
                    'http://website.com/img/tmp-6.gif'
                ],
    image_counter = 0; // To keep track of the current image

setInterval(function() {
    // remove current favicon
    if(document.querySelector("link[rel='icon']") !== null)
        document.querySelector("link[rel='icon']").remove();
    if(document.querySelector("link[rel='shortcut icon']") !== null)
        document.querySelector("link[rel='shortcut icon']").remove();
        
    // add new favicon image
    document.querySelector("head").insertAdjacentHTML('beforeend', '');
    
    // If last image then goto first image
    // Else go to next image    
    if(image_counter == favicon_images.length -1)
        image_counter = 0;
    else
        image_counter++;
}, 200);

You can see this working here: https://usefulangle.com/post/45/animate-favicon-gif-javascript

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top