Created
February 24, 2015 08:53
-
-
Save duguying/3e02403d7706c7d49d8e to your computer and use it in GitHub Desktop.
动态favicon
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>动态favicon</title> | |
<base href="http://www.web-tinker.com" /> | |
<script> | |
window.Promise|| | |
document.write('<script src="/files/promise-1.0.0.min.js"><\/script>'); | |
</script> | |
<link rel="icon" type="image/x-icon" /> | |
<script> | |
var isFirefox=/Firefox/i.test(navigator.userAgent); | |
Promise.all([0,1,2,3].map(function(e,i){ | |
//加载所有所需的图片 | |
return new Promise(function(resolve){ | |
var img=new Image; | |
img.onload=function(){resolve(img.src);}; | |
img.src="/share/TuzkiKneadFaceFrameByFrameIco/"+i+".ico"; | |
}); | |
})).then(function(urls){ | |
var favicon=document.querySelector("link[rel='icon']"); | |
//将4个DataURL轮流设置到favicon上,间隔100ms | |
(function callee(i){ | |
favicon.setAttribute("href",urls[i]); | |
if(isFirefox) //重新绑定link,否则Firefox不会更新 | |
document.head.removeChild(favicon), | |
document.head.appendChild(favicon); | |
setTimeout(callee,100,++i%4); | |
})(0); | |
}); | |
</script> | |
</head> | |
<body> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment