Desenvolvimento do jQuery lightBox plugin ao vivo Leandro Vieira

jQuery jQuery.com Framework JavaScript; Criado e conduzido por John Resig; Utilizada por: Google, Mozilla, Dell, Digg, WordPress, ... Otimiza o desenvolvimento; Simplifica a manipulação HTML, eventos, animação, interações Ajax; Cross-browsers (IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+); Arquitetura de plugins.

jQuery.com

Framework JavaScript;

Criado e conduzido por John Resig;

Utilizada por: Google, Mozilla, Dell, Digg, WordPress, ...

Otimiza o desenvolvimento;

Simplifica a manipulação HTML, eventos, animação, interações Ajax;

Cross-browsers (IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+);

Arquitetura de plugins.

jQuery lightBox plugin Lançado em 21 de Setembro de 2007; Simples; Elegante; Não obstrutivo; Não exige marcação HTML proprietária; Utiliza-se do poder e flexibilidade dos seletores da jQuery; Inspirado no Lightbox JS criado por Lokesh Dhakar. jQuery lightBox plugin e Lightbox JS

Lançado em 21 de Setembro de 2007;

Simples;

Elegante;

Não obstrutivo;

Não exige marcação HTML proprietária;

Utiliza-se do poder e flexibilidade dos seletores da jQuery;

Inspirado no Lightbox JS criado por Lokesh Dhakar.

jQuery lightBox plugin e Lightbox JS

jQuery lightBox plugin X Lightbox JS

Como utilizar o jQuery lightBox plugin Configuração <script type=&quot;text/javascript&quot; src=&quot; jquery.js &quot;></script> <script type=&quot;text/javascript&quot; src=&quot; jquery.lightbox.js &quot;></script> <link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot; jquery.lightbox.css &quot; media=&quot;screen&quot; /> Ativação <script type=&quot;text/javascript&quot;> jQuery(function($) { $('a').lightBox(); }); Marcação HTML necessária <a href=&quot; imagem.jpg &quot; title=&quot;Legenda&quot;> <img src=&quot; imagem-thumb.jpg &quot; alt=&quot;&quot; /> </a>

Configuração

<script type=&quot;text/javascript&quot; src=&quot; jquery.js &quot;></script>

<script type=&quot;text/javascript&quot; src=&quot; jquery.lightbox.js &quot;></script>

<link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot; jquery.lightbox.css &quot; media=&quot;screen&quot; />

Ativação

<script type=&quot;text/javascript&quot;>

jQuery(function($) {

$('a').lightBox();

});

Marcação HTML necessária

<a href=&quot; imagem.jpg &quot; title=&quot;Legenda&quot;>

<img src=&quot; imagem-thumb.jpg &quot; alt=&quot;&quot; />

</a>

Changelog e estatísticas de downloads

jQuery lightBox plugin em: &quot;a volta ao mundo&quot;

Como estamos Mais de 60.000 (e contando...) downloads; Sendo utilizado por desenvolvedores em todo o mundo; Sendo utilizado pela fundação Mozilla*; Firefox Add-ons; Thunderbird Add-ons; Sunbird Add-ons; Seamonkey Add-ons; +39.000 exibições da página do plugin em Setembro de 2008. * Vitor Almeida, 10 de Abril de 2008 às 12:56

Mais de 60.000 (e contando...) downloads;

Sendo utilizado por desenvolvedores em todo o mundo;

Sendo utilizado pela fundação Mozilla*;

Firefox Add-ons;

Thunderbird Add-ons;

Sunbird Add-ons;

Seamonkey Add-ons;

+39.000 exibições da página do plugin em Setembro de 2008.

* Vitor Almeida, 10 de Abril de 2008 às 12:56

Adoro essa imagem

Para onde vamos Planejar lançamento da próxima versão; Corrigir bugs; Adicionar funcionalidades; Redesign do site; Newsletter; FAQ; Botão para doação :D

Planejar lançamento da próxima versão;

Corrigir bugs;

Adicionar funcionalidades;

Redesign do site;

Newsletter;

FAQ;

Botão para doação :D

Mãos à obra!

Preparando o terreno jquery.nomeDoPlugin.js; Novos métodos anexar em jQuery.fn; Novas funções anexar em JQuery; Dentro dos métodos &quot;this&quot; refere-se ao objeto jQuery; Após os métodos ou funções use ponta-e-vírgula (;); Métodos devem retornar o objeto jQuery; Sempre utilize jQuery no lugar de $; Mais detalhes em http://docs.jquery.com/Plugins/Authoring

jquery.nomeDoPlugin.js;

Novos métodos anexar em jQuery.fn;

Novas funções anexar em JQuery;

Dentro dos métodos &quot;this&quot; refere-se ao objeto jQuery;

Após os métodos ou funções use ponta-e-vírgula (;);

Métodos devem retornar o objeto jQuery;

Sempre utilize jQuery no lugar de $;

Mais detalhes em http://docs.jquery.com/Plugins/Authoring

Material de trabalho Baixar em leandrovieira.com/download/8; Conteúdo: jQuery 1.2.6; Arquivo jquery.lightbox.js; Arquivo jquery.lightbox-0.5.js; jQuery lightBox plugin em 23 partes; Imagens utilizada pelo jQuery lightBox plugin; Arquivo CSS para estilizar o jQuery lightBox plugin; 5 fotos; Arquivo .htm

Baixar em leandrovieira.com/download/8;

Conteúdo:

jQuery 1.2.6;

Arquivo jquery.lightbox.js;

Arquivo jquery.lightbox-0.5.js;

jQuery lightBox plugin em 23 partes;

Imagens utilizada pelo jQuery lightBox plugin;

Arquivo CSS para estilizar o jQuery lightBox plugin;

5 fotos;

Arquivo .htm

Trabalhando...

Obrigado! Leandro Vieira Pinho leandrovieira.com [email_address]

Leandro Vieira Pinho

leandrovieira.com

[email_address]