A couple of useful jQuery plugins

I wrote a couple of jQuery plugins to make your coding and layout a little easier.

Perhaps someone they will be helpful. Their code is inspired by posts found on the Internet, and then, due to frequent use, designed as plugins.

The first is jquery.outlinefix.js . Used to remove annoying frames from links that are anchors (for example, a <a href="#"> link </a>).
')
Problem:

(links remain after the click frame)


I’ll note that you can solve it using css (for example, css-tricks.com/removing-the-dotted-outline ), but not only in IE6 and IE7, plus solving this problem using css takes the user away from the ability to use the keyboard for navigation (he will not see which item is selected). And since the share of the solvent population and offices with such a browser still remains, the problem should be fully resolved.

So, an example of using a plugin:

  $ ('a.left-menu-pic'). outlinefix (); 

Plugin source code:

  (function ($) {
	 $ .fn.outlinefix = function () {
		 return this.live ('mousedown', function (e) {
			 e.target.blur ();
			 e.target.hideFocus = true;
			 e.target.style.outline = 'none'
		 }). live ('mouseout', function (e) {
			 e.target.blur ();
			 e.target.hideFocus = false;
			 e.target.style.outline = null;
		 });
	 }
 }) (jQuery); 

The second is jquery.parentn.js . Used to fetch the parent element several levels above the current one. I really didn’t like parent (). Parent (). Parent () constructions and wanted to describe it somehow more concisely, I found the code of the parentn () function on the jquery site in the comments - but it didn’t work, I made it workable and designed plugin so that you can easily connect to your projects.

Example of use:

  $ ('a.left-menu-link'). each (function () {
	 $ (this) .hover (function () {
		 $ (this) .parentn (2) .find ("td: first a.left-menu-pic"). css ("background-position", "0 -59px");
	 },
	 function () {
		 $ (this) .parentn (2) .find ("td: first a.left-menu-pic"). css ("background-position", "0 0");
	 });
 }); 

Plugin source code:

  (function ($) {
	 $ .fn.parentn = function (n) {
		 var $ target = $ (this [0]);
		 for (var i = 0; i <n && $ target; i ++) {
			 $ target = $ target.parent ();
		 }
		 return $ target;
	 }
 }) (jQuery); 

Bonus
Often, plug-ins connect directly to the head of the page and produce a bunch of requests to the web server, which is irrational. It would be logical to merge javascript's into one and go through them with some kind of compressor, for example, YUICompressor.

I use an ant script for compression of css and js based on the script of Sergey Chikuenok from Tekhnogret on the website of the Artemy Lebedev Studio :

www.everfall.com/paste/id.php?v5fxzfpdom72

To adapt the script for your needs, it is enough to change the file names, and also specify the correct path to the .jar file of the YUICompressor, not forgetting along the way to put the ant-task .jar file for YUICompressor - YUIAnt.jar .