jQuery External Image and Tab Plugin

September 14th, 2011

This jQuery Plugin is a quick way to:

open external links in a new tab(_blank)
place an image next to external links

Example Use


Options

blank – if true it will change the links to open in a new tab by adding target=”_blank”. This defaults to true.

path – if set this is the (From the site root) to the image to show next to external links. defaults to ” which will not show an image.

ignore – this is the class name that can be put on a link so that the plugin will not add the image or target changes.


License

WTFPT (http://en.wikipedia.org/wiki/WTFPL) = “Do What The Fuck You Want To Public License”.


Source:

On Github

Full

(function($){
	$.fn.extTab = function(params) {
        var defaults = {
            blank:true,
            path:'',
            ignore:''
        };
        params = $.extend(defaults, params);
        var t = $(this).find("a[href^='http:']").not("[href*='" + document.location.host + "']");
        if(params.ignore != '') {
        	t = t.not("[class*='" + params.ignore + "']");
        }
    	if(params.blank) {
    		t.attr( "target", "_blank" );
    	}
    	if(params.path != '') {
    		t.append(' <img src="http://' + document.location.host + params.path + '">');
    	}
    };
})(jQuery);

Minified

(function(c){c.fn.extTab=function(a){var a=c.extend({blank:!0,path:"",ignore:""},a),b=c(this).find("a[href^='http:']").not("[href*='"+document.location.host+"']");a.ignore!=""&&(b=b.not("[class*='"+a.ignore+"']"));a.blank&&b.attr("target","_blank");a.path!=""&&b.append(' <img src="http://'+document.location.host+a.path+'">')}})(jQuery);

Icons

Just an example of some icons to use

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>