2016-05-13 4 views
4

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

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

См this site's Favicon в качестве примера

У кого-то есть идеи, что мне делать?

+0

Возможного дубликат [Как использовать несколько значков для одного сайта] (HTTP: //stackoverflow.com/questions/25005936/how-to-use-multiple-favicons-for-one-site) –

+0

Я голосую, чтобы закрыть этот вопрос как не по теме, потому что это вопиющий запрос, чтобы кто-то закодировал решение. –

ответ

5

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

Стоит отметить, что some browsers actually support the use of animated .gif images as Favicons, что может быть благоприятным по сравнению с использованием раствора Javascript на основе:

enter image description here

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

enter image description here

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> 
1

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

Changing website favicon dynamically

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

+0

Это не то же самое! Я видел это сообщение сто раз, и этот значок меняется из-за события –

+0

Не это ли это вызов функции, которая вызывает изменение .ico? Я бы подумал, что это очень похоже на то, что делает решение Матиаса в этой ссылке. – Jayson

+0

@MateusBarbosa вместо назначения функции 'btn.onclick', просто передайте его как аргумент' setInterval() '. Минимальное усилие там. –