2016-05-13 8 views
4

Ich habe nach einer Javascript-Erklärung gesucht, wie ich mein Favicon ständig ändern kann, aber ich konnte nichts finden.Wie kann ich meinen FavIcon ständig ändern lassen?

Ich habe 6 Favicons und ich versuche, dann in einer Reihenfolge zu schalten, um eine Art von Animation zu machen. Und mein Problem ist, dass ich brauche, dass die Symbole dynamisch ändern, aber automatisch alle 2 Sekunden in einer Schleife wie ICO1, ICO2, ICO3, ico4, ico5, ico6, ICO1, ICO2 ...

Siehe this site's Favicon als Beispiel

Jemand hat eine Idee, was soll ich tun?

+0

Mögliches Duplikat von [Wie für einen Standort mehr Favicons verwenden] (http: //stackoverflow.com/questions/25005936/how-to-use-multiple-favicons-for-one-site) –

+0

Ich stimme zu, diese Frage als off-topic zu schließen, weil es eine unverhohlene Bitte ist, jemanden zu programmieren Lösung. –

Antwort

5

Betrachten Sie eine Verwendung .gif

Es ist erwähnenswert, dass some browsers actually support the use of animated .gif images as Favicons, die günstig im Gegensatz sein könnte, eine Javascript-basierte Lösung mit:

enter image description here

Javascript Ansatz und Beispiel

enter image description here

Ein Javascript Ansatz könnte Ihre Symbole innerhalb eines Arrays und mit Hilfe der setInterval() Funktion beinhaltet die Speicherung Ihr Intervall zu definieren, sie wechseln:

<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

Sie könnten entweder ein animiertes .ico erstellen, indem Sie ein gif konvertieren, oder Sie könnten ein bisschen Javascript einwerfen, um es zu tun. Einige Möglichkeiten, um es durch js zu tun, sind hier zu finden:

Changing website favicon dynamically

nächste Mal sind Sie vielleicht zu stellen, welchen Code Sie versucht haben, die Menschen hier sind in der Regel negativ Fragen anzuzeigen, wie das Ihre offene sind fyi.

+0

Es ist nicht das Gleiche! Ich habe diesen Beitrag hundert Mal gesehen und dieses Symbol ändert sich aufgrund eines Ereignisses. –

+0

Wird nicht nur die Funktion aufgerufen, die dazu führt, dass sich die .ico-Datei ändert? Ich denke, das ist sehr ähnlich zu Mathias 'Lösung in diesem Link. – Jayson

+0

@MateusBarbosa, anstatt die Funktion 'btn.onclick' zuzuordnen, übergeben Sie sie einfach als Argument an' setInterval() '. Minimaler Aufwand dort. –