Développez votre propre plug-in jQuery !

$('p').notreSuperPlugIn();
//Là, tous les paragraphes de notre page verront notre plug-in appliqué sur eux !

jQuery.extend(jQuery.fn,
{		
    notreSuperPlugIn: function(parametres)
    {
        //Code de notre plug-in ici
    },
    secondPlugIn: function(parametres)
    {
        //Code du second plug-in ici
    }
});

jQuery.fn.notreSuperPlugIn=function(parametres)
{
   //Code de notre plug-in ici
};

(function($)
{
    $.fn.notreSuperPlugIn=function(parametres)
    {
       //Code de notre plug-in ici
    };
})(jQuery);

$('p').notreSuperPlugIn();

$('div').notreSuperPlugIn(); //this fera référence à l'objet jQuery $('div')
$('#header').notreSuperPlugIn(); //this fera référence à l'objet jQuery $('#header')
$('table.commentaire').notreSuperPlugIn(); //this fera référence à l'objet jQuery $('table.commentaire')

(function($)
{
    $.fn.notreSuperPlugIn=function(parametres)
    {
       this.each(function()
       {
           //Code de notre plug-in ici
       });
    };
})(jQuery);

$('p').css('color','red').appendTo($('div')).show();

$('p').css('color','red').notreSuperPlugIn().appendTo($('div')).show();

(function($)
{
    $.fn.notreSuperPlugIn=function(parametres)
    {
       this.each(function()
       {
           //Code de notre plug-in ici
       });

       return this;
    };
})(jQuery);

(function($)
{
    $.fn.notreSuperPlugIn=function(parametres)
    {
       return this.each(function()
       {
           //Code de notre plug-in ici
       });
    };
})(jQuery);

(function($)
{ 
	$.fn.hoverFade=function()
	{
	   return this.each(function()
	   {
		//On veut que l'élément change au passage de la souris, on utilise donc mouseover() !
		$(this).mouseover(function()
		{
			//On diminue donc l'opacité lentement
			$(this).fadeOut('slow',function()
			{
				//Une fois l'élément invisible, on le fait réapparaitre rapidement !
				$(this).fadeIn('fast');
			});
		});
	   });						   
	};
})(jQuery);

(function($)
{ 
	$.fn.hoverFade=function(vitesseFadeOut, vitesseFadeIn)
	{
	   return this.each(function()
	   {
		//On veut que l'élément change au passage de la souris, on utilise donc mouseover() !
		$(this).mouseover(function()
		{
			//On diminue donc l'opacité lentement
			$(this).fadeOut(vitesseFadeOut,function()
			{
				//Une fois l'élément invisible, on le fait réapparaitre rapidement !
				$(this).fadeIn(vitesseFadeIn);
			});
		});
	   });						   
	};
})(jQuery);

$('p').hoverFade(2500,2000);

$.fn.unSuperPlugIn=function(vitesse, couleur, largeur, hauteur, position_x, position_y, cible){};

(function($)
{ 
	$.fn.hoverFade=function(options)
	{
	   //options est donc un objet littéral, ne l'oublions pas !
           
           //On définit nos paramètres par défaut
           var defauts=
           {
               "vitesseFadeOut": "slow",
               "vitesseFadeIn": "fast"
           };  
           
           //On fusionne nos deux objets ! =D
           var parametres=$.extend(defauts, options); 
           
           return this.each(function()
	   {
		//On accèdera à la vitesse du fadeOut via parametres.vitesseFadeOut
                //et à celle du fadeIn via parametres.vitesseFadeIn
              
                //On veut que l'élément change au passage de la souris, on utilise donc mouseover() !
                $(this).mouseover(function()
                {
                    //On diminue donc l'opacité lentement
                    $(this).fadeOut(parametres.vitesseFadeOut,function()
                    {
                       //Une fois l'élément invisible, on le fait réapparaître rapidement !
                       $(this).fadeIn(parametres.vitesseFadeIn);
                    });
                });
	   });						   
	};
})(jQuery);

$('a').hoverFade();
$('h1').hoverFade({"vitesseFadeIn": 2350});
$('#test').hoverFade({"vitesseFadeIn": 2350,"vitesseFadeOut": "normal"});

var defauts=
{
    "vitesseFadeOut": "slow",
    "vitesseFadeIn": "fast",
    "callback": null
};

$(this).mouseover(function()
{
     //On diminue donc l'opacité lentement
     $(this).fadeOut(parametres.vitesseFadeOut,function()
     {
          //Une fois l'élément invisible, on le fait réapparaitre rapidement !
          $(this).fadeIn(parametres.vitesseFadeIn,function()
          {
               //Si le parametre callback ne vaut pas null, c'est qu'on a précisé une fonction !
               if(parametres.callback)
               {
                  parametres.callback();
               }
          });
     });
});

$('a, h1').hoverFade({"callback": function()
{
    alert('Animation finie !');
}});

$('a, h1').hoverFade({"callback": function(data)
{
    alert('Voici ce que contient data : '+data);
}});

if(parametres.callback)
{
    parametres.callback();
}

if(parametres.callback)
{
    parametres.callback("toto",23,$(this).text());
}

$('a, h1').hoverFade({"callback": function(data,radiateur,chocolat)
{
    alert("Voici ce que contient data : " + data + "\nEt radiateur : " + radiateur + "\nEt enfin chocolat : " + chocolat);
}});

$('a, h1').hoverFade({"callback": function()
{
    //On peut mettre ce que l'on veut ici, on ne peut juste pas accéder aux trois variables qu'on l'on a défini dans notre plug-in =)
    alert("Voici ce que contient data : " + data + "\nEt radiateur : " + radiateur + "\nEt enfin chocolat : " + chocolat);
    //Puisqu'on essaye d'accéder aux variables, le script plante, alors attention !
}});

(function($)
{ 
	$.fn.imageSlide=function(options)
	{     
            //On définit nos paramètres par défaut
            var defauts=
            {
		'interval': 5000,		//Intervalle entre chaque image, en millisecondes
		'width': '300px',		//Largeur de la galerie
		'height': '150px',		//Hauteur de la galerie
		'scaleWidth': true,		//Doit-on adapter la largeur de l'image ?
		'scaleHeight': true,	        //Doit-on adapter la hauteur de l'image ?
		'makeLinks': false,		//Doit-on créer des liens ?
		'callback': null		//Fonction appelée à chaque nouvelle image
            };  
           
            //On fusionne nos deux objets ! =D
            var parametres=$.extend(defauts, options);
		
	    //Si l'intervalle est trop court, on le fixe à 1 seconde
	    //pour éviter que le défilement soit trop rapide
	    parametres.interval=Math.max(1000,parametres.interval);
		
            return this.each(function()
	    {
			//On stocke notre élément dans une variable par commodité
			var element=$(this);
							
			//On compte le nombre d'images de notre galerie
			var totalImages=element.find('img').length;
			
			//Le compteur pour nous permettre de parcourir les images
			var compteur=0;
				
			//On modifie le style de notre galerie
			element.css(
			{
				'border': '1px solid #000',
				'width': parametres.width,
				'height': parametres.height,
				'overflow': 'hidden'
			}).find('img').each(function(id) //Puis on parcourt enfin chaque image !
			{
				//Si on doit adapter les dimensions des images, on le fait
				if(parametres.scaleWidth)
				{
					$(this).css('width','100%')
				}
				if(parametres.scaleHeight)
				{
					$(this).css('height','100%')
				}
				//Si on fait des liens, on change le curseur et on 
				//enlève la bordure bleue toute moche
				if(parametres.makeLinks)
				{
					$(this).css(
					{
						'cursor': 'pointer',
						'border': '0px'
					});
					//Et on entoure l'image de son lien, récupéré via le alt !
					$(this).wrap('<a href="'+$(this).attr('alt')+'"></a>');
				}					
				
				//On ne fait apparaitre que la première image
				if(id>0)
				{
					$(this).hide();
				}
			});
			
			//Et on définit enfin notre défilement
			setInterval(function()
			{	
				//On récupère l'image actuellement visible et on la fait disparaitre
				element.find('img:eq('+compteur+')').fadeOut(function()
				{						
					//On incrémente le compteur si on n'est pas sur la dernière image
					//Sinon, on le remet à 0		
					if(compteur!=totalImages-1)
					{
						compteur++;
					}
					else
					{
						compteur=0;
					}
					//Et on fait donc apparaitre l'image suivante
					element.find('img:eq('+compteur+')').fadeIn(function()
					{
						//Et si on a une fonction définie, on l'appelle !
						//Et on lui passe notre image en paramètre
						if(parametres.callback)
						{
							parametres.callback($(this));
						}
					});
				});
			},parametres.interval);
		});						   
	};
})(jQuery);

$('#galerie').imageSlide(
{
	'width': '500px',
	'height': '300px',
	'makeLinks': true,
	'callback': function(image)
	{
		$('#description').text(image.attr('title'));
	}
});