Seja bem vindo visitante!
![]() |
Olá seja bem vindo ao Verdinhas. Somos uma comunidade jovem e vibrante. Rapidamente estamos nos tornando referência nacional e internacional para webmasters, investidores e empreendedores online - algo singular para língua portuguesa. |
|
|
|
|
![]() ![]() |
Tutorial - Com Criar Efeitos De Ampliar Imagem No Blogger, Amplie A Imagem Sem Abrir Ou Mudar De Janela |
Mar 28 2010, 06:26 PM
Post
#1
|
||
|
Grupo: Moderador Posts: 1.695 Registrado: 14-September 08 De: Goiânia/GO Membro N°: 12.027 País:
BrasilInteresse: Investidor Investidor: Agressivo iTrader: 20 (100%) Pontos: $978 Verdinhas Exibir inventário |
Esse sistema é mais comum em plataformas Wordpress, mas aqui explicarei como usa-la no Blogger. Clique na imagem abaixo para ver uma demonstração:
![]() (Clique em qualquer miniatura no site acima para ver uma prévia.) Passo a Passo: 1. Baixe o pacote de Scripts e CSS aqui. 2. Extraia o arquivo ZIP e envie as pastas para qualquer servidor, respeitando os caminhos. 3. Vá no Blogger, Editar HTML e coloque o seguinte código logo acima da tag </HEAD>, substituindo "http://www.site.com/" pelo site onde você hospedou as pastas com os arquivos (imagens, CSS e scripts): CODE <script type='text/javascript' src='http://www.site.com/js/prototype.js'></script> <script type='text/javascript' src='http://www.site.com/js/scriptaculous.js?load=effects,builder'></script> <script type='text/javascript' src='http://www.site.com/js/lightbox.js'></script> 4. Insira o código abaixo entre as tags <HEAD> e </HEAD>: CODE <link rel="stylesheet" href="http://www.site.com/css/lightbox.css" type="text/css" media="screen" /> 5. Crie um novo post no seu blog e adicione uma imagem qualquer. 6. Vá para o Editar HTML em sua atual postagem e você verá um código similar ao abaixo: CODE <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_fn3ju830LgY/S6-0iKVBAlI/AAAAAAAABoM/vHRkNzu8RPc/s1600/waavy.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 317px; height: 320px;" src="http://3.bp.blogspot.com/_fn3ju830LgY/S6-0iKVBAlI/AAAAAAAABoM/vHRkNzu8RPc/s320/waavy.jpg" alt="" id="BLOGGER_PHOTO_ID_5453776172750013010" border="0" /></a> 7. Adicione antes da tag "onblur" o comando rel="lightbox". O código então fica: CODE <a rel="lightbox" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_fn3ju830LgY/S6-0iKVBAlI/AAAAAAAABoM/vHRkNzu8RPc/s1600/waavy.jpg"><img style="display: block; margin: 0px auto 10px; text-align: center; cursor: pointer; width: 317px; height: 320px;" src="http://3.bp.blogspot.com/_fn3ju830LgY/S6-0iKVBAlI/AAAAAAAABoM/vHRkNzu8RPc/s320/waavy.jpg" alt="" id="BLOGGER_PHOTO_ID_5453776172750013010" border="0" /></a> 8. Publique a postagem e clique na imagem do seu blog para testar. Caso não funcione, verifique se os caminhos especificados no arquivo CSS estão corretos, em relação ao de onde você instalou seu script. --------------------
--------------------
|
|
|
|
||
![]() ![]() ![]() |
1 usuário(s) está(ão) lendo este tópico (1 visitantes e 0 usuários anônimos)
0 membros:
Tópicos Similares
| Tópico | Respostas | Autor | Visualizações | Última ação | |
|---|---|---|---|---|---|
![]() |
Fixado: Tutorial - Como Investir Em Hyips Passo A Passo Dicas e Explicação Detalhada Para Novos Investidores |
27 | Mαяіο | 4.779 | 18th May 2012 - 09:54 PM Último post por: milionclub |
![]() |
Tutorial - Como Comprar Na Dinodirect Loja Mais Barata Que A FocalPrice e Deal Extreme! |
1 | Mαяіο | 909 | 28th March 2012 - 05:56 PM Último post por: Angel84 |
![]() |
Tutorial Completo - O Que É Webmoney (wmz)? Aprenda Mais Sobre Essa E-Currency |
0 | Mαяіο | 203 | 24th March 2012 - 02:23 PM Último post por: Mαяіο |
![]() |
Tutorial - Como Comprar Na Focalprice ★★ Comprando da China Pelo PayPal ★★ |
18 | Mαяіο | 2.662 | 21st March 2012 - 03:17 PM Último post por: Mαяіο |
![]() |
Tutorial - Ganhe Mais De $200 Mensais No Sharecash Faça Você Mesmo Seu Lucro! |
40 | Mαяіο | 8.379 | 6th March 2012 - 11:07 AM Último post por: wal_rocha |
|
Versão Simples | Horário: 24th May 2012 - 12:26 AM |
Skin designed by IPB Forum Skins
|
|
|
Exibir/Esconder Navegador




Mar 28 2010, 06:26 PM
Brasil









