Favicons 2.0
Created Tuesday 16th of September 2008 by Andreas Lagerkvist
Copyright © 2008 Andreas Lagerkvist (andreaslagerkvist.com)
Please have a look at the "Other Resources" for bug reports or further help on jQuery. Do not post bug reports or feature requests as comments to unrelated articles. If bug reporting on bugtracker.a-framework.org fails, e-mail me.
What it Does
This little plug-in will insert favicons to all external links found on your site. The plug-in scans the URL the link is pointing to for a favicon and, if it can't find one, displays any generic favicon-image you like instead.
How to Use
jQuery(document.body).favicons({insert: 'prependTo'}); would prepend favicons to every external link in the document.
You wanna run the plug-in on a parent-element of the external links. Unless you want certain external links not to have a favicon there's no reason not to run the plug-in on document.body.
Example Code
HTML
<div id="jquery-favicons-example">
<ul>
<li><a href="http://www.codinghorror.com/blog/">Coding Horror</a></li>
<li><a href="http://remysharp.com">remy sharp's b:log</a></li>
<li><a href="http://snook.ca/jonathan/">Snook.ca</a></li>
<li><a href="http://www.danwebb.net">DanWebb.net</a></li>
<li><a href="http://www.dustindiaz.com/">DustinDiaz.com</a></li>
</ul>
</div>
JS
jQuery('#jquery-favicons-example').favicons({insert: 'insertBefore', defaultIco: WEBROOT +'aFramework/Styles/__common/gfx/jquery.favicons.png'});
Source Code
jQuery.fn.favicons = function (conf) {
var config = jQuery.extend({
insert: 'appendTo',
defaultIco: 'favicon.png'
}, conf);
return this.each(function () {
jQuery('a[href^="http://"]', this).each(function () {
var link = jQuery(this);
var faviconURL = link.attr('href').replace(/^(http:\/\/[^\/]+).*$/, '$1') + '/favicon.ico';
var faviconIMG = jQuery('<img src="' + config.defaultIco + '" alt="" />')[config.insert](link);
var extImg = new Image();
extImg.src = faviconURL;
if (extImg.complete) {
faviconIMG.attr('src', faviconURL);
}
else {
extImg.onload = function () {
faviconIMG.attr('src', faviconURL);
};
}
});
});
};
