Lightbox GB


Lightbox - ;^)
Um lightbox normalmente é um gerenciador de imagem em CSS que permite a imagem abrir na tela sem precisar carrega uma nova pagina, facilita a organização das janelas e deixa o ambiente navegável com uma cara moderna.
Com um pouco de CSS, HTMl e JavaSCRIPT eu fiz o meu próprio lightbox.
Pronto para começar a instalação?
Então, vamos lá.
Para começar, vá no painel do seu blog, selecione Layout > Editar HTML e faça um becape do seu template. Ainda nessa página, cole o código abaixo antes de </head> (aperte CTRL+F para encontrar).
<LINK REL="stylesheet" TYPE="text/css" HREF="http://guiab.webs.com/css/lightbox.css"/>
<script src="http://guiab.webs.com/scripts/lightbox.js"></script>
Depois, cole o código abaixo antes de </body>.
<!-- Início do Lightbox -->
<div id="lightbox" onContextMenu="return false">
<center>
<div id="between" class="dragme">
<div id="content">
<img src='load.gif'/>
</div>
<h6>Lightbox by <a href="http://guiab.blogspot.com/" target="_blank">Guia Blogger</a></h6>
</div>
</div>
</center>
</div>
<!-- Fim do Lightbox -->
Visualiza para ver se há erros, depois salve.
Quando quiser acionar o lightbox por um link por exemplo:
<a href="LINK QUE DEVE SER ABERTO PELA LIGHTBOX" onClick="Set_lightbox(this.href,'ALTURA DA CAIXA','LARGURA DA CAIXA','')" >NOME DO SEU LINK</A>
As partes em negrito devem ser alteradas de acordo com a sua necessidade.
É isso. Se ficou alguma dúvida, encontrou algum erro, deixe um comentário.
P.S.: Para ver o script em ação, clique aqui

Comentários

  1. Acho que no Chrome não funcionou...

    Forte abraço

    ResponderExcluir
  2. @Seu Noca, no meu funcionou. Eu vou testar no CHROME de outros computadores e ver se dá erro.
    Abraço

    ResponderExcluir
  3. Falaí!
    Legal, mas precisa corrigir umas ideias aqui do seu blog.
    Essa já é a segunda que não funciona!
    Eu fiz um site hospedado no Blogger onde fiz funcionar o Light Box. Ainda estou editando o CSS, mas já tá lá.

    www.imwarturalvim.com.br

    É só dar uma pesquisadinha na web que você encontra uns toques que funcionam!
    Flws...

    ResponderExcluir

Postar um comentário

Sinta-se livre para comentar. Mas lembre-se: os comentários devem estar relacionados ao assunto do post e tudo o que você escrever fica por sua conta e responsabilidade.

Postagens mais visitadas deste blog

Resumir Postagens