O documento fornece instruções para criar um plugin jQuery. Explica que o plugin deve ser definido como uma função no objeto jQuery.fn para que possa ser chamado como um método em objetos jQuery. Também recomenda usar um closure para evitar conflitos com outras bibliotecas que usem o sinal $. Destaca a importância de considerar o contexto this dentro do plugin para que funcione corretamente em cada elemento do DOM.

1. Criando um plugin

2. Quem sou eu?
● Guilherme Rey
● Corinthiano
● Computeiro

3. Por que plugins?

5. Primeiro passo
jQuery.fn.meuplugin = function () {
// Meu super plugin
};

6. O sinal
● Mas e o $? Posso usar numa boa?

7. O sinal
● Mas e o $? Posso usar numa boa?
● Até pode, mas e se conflitar?

8. O sinal
● Mas e o $? Posso usar numa boa?
● Até pode, mas e se conflitar?
● Mas assim: (com closure)
(function( $ ) {
$.fn.seuplugin = function () {
// Seu super plugin
};
})(jQuery);

9. O sinal
● Mas e o $? Posso usar numa boa?
● Até pode, mas e se conflitar?
● Mas assim: (com closure)
(function( $ ) {
$.fn.seuplugin = function () {
// Seu super plugin
};
})(jQuery);
● É perfeito!

10. Contexto
● Temos que pensar no contexto
$('elemento').seuplugin();
(function( $ ) {
$.fn.seuplugin = function () {
// Aqui o this é um objeto jQuery
// $(this) = $($(this))
// Isso funciona:
this.show('fast', function(){
● É perfeito! // Aqui, this é um elemento DOM
});
};
})(jQuery);

11. Como diria o Tite...
● ... vamos manter a "Correntabilidade"!
(function( $ ) {
$.fn.seuplugin = function () {
return this.each(function () {
// Seu super plugin
});
};
})(jQuery);
as
● Assim, a corrente continua! $(obj).metodo().metodo()...

12. Code!
● Let's code!

13. Obrigado!
@guilhermerey
www.guilhermerey.com.br