Как сделать так, чтобы мой FavIcon постоянно менялся?

Я искал объяснение javascript о том, как я могу постоянно менять свой значок, но ничего не нашел.

У меня есть 6 фавиконов, и я пытаюсь сделать так, чтобы они переключались, чтобы сделать что-то вроде анимации. И моя проблема в том, что мне нужно, чтобы значки менялись динамически, но автоматически каждые 2 секунды в цикле, таком как ico1, ico2, ico3, ico4, ico5, ico6, ico1, ico2...

В качестве примера см. Favicon этого сайта.

Кто-то знает, что мне делать?


javascript favicon webpage
person Mateus Barbosa    schedule 13.05.2016    source источник
comment
Возможный дубликат Как использовать несколько фавиконов для одного сайта   -  person Eric G    schedule 13.05.2016
comment
Я голосую за то, чтобы закрыть этот вопрос как не по теме, потому что это вопиющая просьба к кому-то закодировать решение.   -  person Tony Hinkle    schedule 13.05.2016

Ответы (2)


arrow_upward
5
arrow_downward

Рассмотрите возможность использования .gif

Стоит отметить, что некоторые браузеры фактически поддерживают использование анимированных .gif изображений в качестве фавиконок, что может быть благоприятным, а не использовать решение на основе Javascript:

введите описание изображения здесь

Подход и пример JavaScript

введите описание изображения здесь

Подход Javascript может включать хранение ваших значков в массиве и использование setInterval() для определения интервала их переключения:

<head>
    <title>Favicon Testing</title>
    <!-- References to switch -->
    <link id="icon-a" rel="shortcut icon" type="image/png" href="http://icons.iconarchive.com/icons/icons8/windows-8/16/Numbers-1-icon.png" />
    <link id="icon-b" rel="shortcut icon" type="image/png" href="http://icons.iconarchive.com/icons/icons8/windows-8/16/Numbers-1-icon.png" />
    <meta charset="utf-8" />
</head>
<body>
    <script>
        // Store your current icon
        var current = 0;
        var icons = ['http://icons.iconarchive.com/icons/icons8/windows-8/16/Numbers-1-icon.png', 'http://hakimuzunyol.orgfree.com/Tugce/assets/icons/twitter_23.png', 'https://upload.wikimedia.org/wikipedia/commons/5/5a/T-bane_3_icon.png'];
        // Every 2 seconds, switch your icon
        setInterval(function () {
            // Determine the next icon
            var icon = (++current % icons.length);
            // Grab the URL to use
            var url = icons[icon];
            // Update your elements
            document.getElementById('icon-a').href = url;
            document.getElementById('icon-b').href = url;
        }, 2000);
    </script>
</body>
person Rion Williams    schedule 13.05.2016

arrow_upward
1
arrow_downward

Вы можете либо создать анимированный .ico, преобразовав gif, либо добавить немного javascript для этого. Некоторые способы сделать это через js можно найти здесь:

Динамическое изменение значка веб-сайта

В следующий раз, когда вы, возможно, захотите опубликовать код, который вы пробовали, люди здесь, как правило, негативно относятся к открытым вопросам, таким как ваш, к вашему сведению.

person Jayson    schedule 13.05.2016
comment
Это не то же самое! Я видел этот пост сто раз, и этот значок меняется из-за события - person Mateus Barbosa; 13.05.2016
comment
Разве это не просто вызов функции, которая вызывает изменение .ico? Я думаю, что это очень похоже на то, что делает решение Матиаса в этой ссылке. - person Jayson; 13.05.2016
comment
@MateusBarbosa вместо того, чтобы назначать функцию btn.onclick, просто передайте ее в качестве аргумента setInterval(). Там минимум усилий. - person Patrick Roberts; 13.05.2016