Que Código é Esse?

#1 Rods

Normal

Usuários
64 posts

Sexo:Não informado
Localidade:São Paulo
Interesses:SEO, CSS, tableless, deign, arte, javscript, trenologia, desenvolvimento

Posted 16/02/2007, 09:08

Olá, amigos...

Bem, eu vi hoje nesta página uma espécie de pop-up que me chamou bastante atenção. Clique numa das imagens da matéria e verá...

Alguém pode me dizer qual é o nome disso e me passar o código certinho? trabalho numa redação de jornal e isso seria bem interessante de se usar. Por exemplo, destacar um parágrafo de alguma notícia...

espero ter postado no lugar certo, caso contrário, moderador me desculpe!

Agradeço a ajuda..
abraços (y)

BobbyCak likes this

Semântica Web - Sites otimizados e SEO
www.semanticaweb.com.br

#2 Paulo André

Why so serious?

Ex-Admins
5114 posts

Sexo:Masculino
Localidade:Belo Horizonte - MG
Interesses:O.Q.F.J.?

Posted 16/02/2007, 09:28

http://www.huddletog...ects/lightbox2/

Funciona perfeitamente em qualquer browser.. o cara desse site ai que você passou que deve ter bixado o código fazendo não funcionar no Firefox.

PS. não sei porque mas agora funcionou no FF também.

Flws...

Até mais

Edição feita por: Paulo André, 16/02/2007, 09:30.

Paulo André G Rodrigues,
ex-administrador Fórum WMO.

www.CanalDev.com.br

#3 Rods

Normal

Usuários
64 posts

Sexo:Não informado
Localidade:São Paulo
Interesses:SEO, CSS, tableless, deign, arte, javscript, trenologia, desenvolvimento

Posted 16/02/2007, 10:22

Opa! valeu Paulo! acho q isso deve resolver...vou testar aqui e depois falo se deu certo...brigadão

Ai, Paulo, testei aqui e consegui!
esse link q vc passou é muito fácil de se aprender e realmente funciona em todos os browsers...
vc sabe se isso é muito usado? pq eu n vejo isso em, sites por ai..

obrigado pela ajuda

abraço

Semântica Web - Sites otimizados e SEO
www.semanticaweb.com.br

#4 TTC_VeNdEdOr

Curioso

Usuários
433 posts

Sexo:Masculino
Localidade:João Pessoa - PB

Posted 18/02/2007, 08:44

e se eu quiser por no link de downloads da minha pagina, ai aparecer uma imagem e logo depois redirecionar pra propria pagina de downloads, tem como?

tem como inserir links nas figuras?

Age of Empires III - www.ageofempires3.com.br
Age of Empires II - www.ageofempires2.com.br
NÃO RECOMENDO: Levei calote da hospedagem BRWebs, assim que paguei cancelaram e não devolveram :/

#5 Rods

Normal

Usuários
64 posts

Sexo:Não informado
Localidade:São Paulo
Interesses:SEO, CSS, tableless, deign, arte, javscript, trenologia, desenvolvimento

Posted 06/03/2007, 10:59

olá

O lightbox funcionou na minha página, porém com um pequeno erro:
As imagens "close" e a imagem "carregando" ficam quebradas...a foto abre normal, mas esse pequeno erro acaba desorientando o usuário na hora de fechar...

espero que possa me ajudar, obrigado

Semântica Web - Sites otimizados e SEO
www.semanticaweb.com.br

#6 knoxville

Backdoor Man

Usuários
951 posts

Sexo:Masculino
Localidade:Itajaí - SC

Posted 12/03/2007, 15:15

Rods, você deve editar o arquivo .css, é nele que está o caminho para estas imagens

tenho uma dúvida... como faço para usar um arquivo que nao seja uma img??? ou seja... o link abre uma pagina html, asp, qlq extensão...
brigadão!!!

sonnekönig. \o/

www.mamados.com.br
Sol Beltrame

#7 Rods

Normal

Usuários
64 posts

Sexo:Não informado
Localidade:São Paulo
Interesses:SEO, CSS, tableless, deign, arte, javscript, trenologia, desenvolvimento

Posted 13/03/2007, 09:30

Deu tudo certo agora...obrigado pessoal

Semântica Web - Sites otimizados e SEO
www.semanticaweb.com.br

#8 PauloCrow

Novato no fórum

Usuários
5 posts

Sexo:Não informado

Posted 15/07/2007, 04:25

EDITADO...

Eu também queria que abrisse outras paginas sem falar que também queria um botão para ir passando as imagens, mas encontrei uma nova versão que faz tudo isso ai, é só abrir o link...

http://www.dolem.com/lytebox/

Agora vamos a um breve guia:

No Topo da pagina que vai se abrir o LyteBox coloque essa linha...
Veja que tem o ( margin:0 auto ) isso serve pra não ficar uma faixa branca na lateral junto a barra de rolagem, ou seja, ele realmente vai cubrir tudo!

<script type="text/javascript" language="javascript" src="lytebox.js"></script>
<link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />
<BODY style="margin:0 auto"></BODY>

Agora para colocar uma imagem comum, não tem segredo é só incluir essa linha:

<a href="imagem_1.jpg" rel="lytebox" title="Image Description">Imagem 1</a>

Agora esse é pra grupos de imagem.
ele ajuda a passar pelas imagens sem precisar fechar o LyteBox:

<a href="images/1-1.jpg" rel="lytebox[vacation]" title="Mom and Dad">Imagem 1</a>
<a href="images/1-2.jpg" rel="lytebox[vacation]" title="My Sister">Imagem 2</a>

Esse é para Slide com opção de pausa e continuar:

<a href="images/1-2.jpg" rel="lyteshow[vacation]" title="Mom and Dad">Imagem 1</a>
<a href="images/1-3.jpg" rel="lyteshow[vacation]" title="My Sister">Imagem 2</a>

Essa linha é para paginas fora do seu site.
Perceba que tem como ajustar largura e altura tranquilamente:

<a href="http://www.google.com" rel="lyteframe" title="Search Google" rev="width: 700px; height: 480px; scrolling: no;">Google</a>

E pra finalizar, o que mais gostei, vc coloca varias paginas e pode ajustar tamanho individualmente e tem opção de Proxima e Anterior, fica passando pelas paginas, otimo pra quem tem tutorial por exemplo ou precisa mostrar um contrato antes da pessoa se registre:

<a href="contrato.html" rel="lyteframe[catalog]" title="Contrato" rev="width: 700; height: 480; scrolling: no;">Pagina 1</a>
<a href="registro.html" rel="lyteframe[catalog]" title="Formulario de registro">Registro</a>

Bom é isso ai, espero que gostem pois eu fiquei de boca aberta aqui com essa ferramenta.

vlw

Edição feita por: PauloCrow, 15/07/2007, 06:31.

#9 Raphaell

Normal

Usuários
80 posts

Sexo:Masculino
Localidade:Recife/PE
Interesses:Tableless, CSS, XHTML, Flash, ActionScript, Photoshop, Fireworks, Teoria das cores, Webdesign.

Posted 24/07/2007, 10:09

O código seria JavaScript !

Raphael Taveira Webdesigner
Avaliação (x)HTML, CSS & Visual.
Ocupado com projeto !!!
"Minhas seções": CSS & Semântica(Tableless)
Contato: raphaelstrous@yahoo.com.br

#10 Paulo André

Why so serious?

Ex-Admins
5114 posts

Sexo:Masculino
Localidade:Belo Horizonte - MG
Interesses:O.Q.F.J.?

Posted 24/07/2007, 11:47

@ PauloCrow

O Lightbox 2 tem um botão para ir passando as imagens sim. Ao abrir uma e posicionar o mouse do lado direito ou esquerdo da imagem, aparecerá.

Mas depende de você colocar lightbox[roadtrip] na propriedade rel do link.

Flws...
(y)

Até mais

Paulo André G Rodrigues,
ex-administrador Fórum WMO.

www.CanalDev.com.br

#11 pLatik

Novato no fórum

Usuários
5 posts

Sexo:Não informado

Posted 20/11/2007, 16:59

hei pessoal!!

será que alguém me poderia ajudar a implementar o lytebox, passando variáveis através de um form para o iframe que abre junto com o lytebox? o meu código é o seguinte:

<script language="JavaScript" type="text/JavaScript">

function startLytebox(href, title, rel, rev) {
var el = document.getElementById('lytebox_misc');
el.href = href;
el.title = title;
el.rel = rel;
el.rev = rev
myLytebox.start
}
</script>

<a href="minha_url" rel="lyteframe" rev="width: 850px; height: 500px; scrolling: no;" title="Some Title" id="lytebox_misc" onclick="startLytebox(this.href, this.title, this.rel, this.rev);">

<input name="submit" type="image" src="../imagens/submeter.gif">

</a>

tentei "buscar" o valor inserido por o utilizador dessa forma:

<a href="minha_url?Cidade='document.form1.wCidade.value;'" rel="lyteframe" rev="width: 850px; height: 500px; scrolling: no;" title="Some Title" id="lytebox_misc" onclick="startLytebox(this.href, this.title, this.rel, this.rev);">

<input name="submit" type="image" src="../imagens/submeter.gif">

</a>

os valores são passados através de selectbox, alguém que me ajude, por favor....

#12 All

Turista

Usuários
59 posts

Sexo:Não informado

Posted 21/03/2008, 13:13

é possivel abrir um swf usando esse litebox ou o tickbox???
tenho uma animação para abrir somente ela na tela (escurendo o fundo assim e tal) e esse recurso seria perfeito pro q eu quero..
é possivel chamar uma swf????
Sendo q o botão q é clicado tb esta num swf (da home)???

#13 Neffertine

Turista

Usuários
27 posts

Sexo:Não informado

Posted 02/05/2008, 15:38

Amigo,

Acredito que com greyBox você consiga^^ (postagem dele é antiga, mas as vezes ajude até mesmo outras pessoas)
http://orangoo.com/labs/GreyBox/