[triko]

Em primeiro lugar, este tuto quem fez foi o Lucas Ferreira, o cara manja pá cacilda hehe!
Então todos os creditos são do homi!
Só estou postando aqui, pq muita gente não tem conhecimento do blog do Lucas e também para ajudar o pessoal que vem em busca de aprendizado aqui no forum MXS!


Então vamos lá!

Acho que a maioria dos desenvolvedores web já conhecem o Lightbox. É um efeitinho super supimpa (tirando o peso) de ampliar imagens, baseado em Javascript e CSS.

Pois bem, devido ao fato de ser JS e CSS, muita gente fica na mão se deseja utilizar o recurso no Flash, contando que estejam sem tempo ou sem conhecimento, para desenvolver tal efeito 100% Flash. Aí que entra a integração que apresentarei aqui

--------------------
Para utilizar o LightBox acionado a partir do flash, primeiro você deve fazer o de praxe como apresentado neste link (carregar os arquivos .js e .css, as imagens e etc), deixar tudo certinho como se fosse usar o LightBox normalmente, isso tudo você acerta no HTML que receberá o SWF(Flash) com a ação em questão.

Depois coloque a seguinte função JavaScript(entre as tags SCRIPT) no mesmo HTML:

CODE

function showFoto(src)
{
    //criando um link falso, para o LightBox captar as informações
    var a_false = document.createElement("A");
    a_false.rel = "lightbox";
    a_false.href = src;
    //chamando a função do lightbox responsável pelo início das ações
    myLightbox.start(a_false);
    //anulando o link
    a_false = null;
}

E no Flash, em nosso botão, chamamos na ação onRelease, o seguinte AS:

AS

getURL("java script:showFoto('MINHAFOTOAQUI.jpg');", "_self");

getURL("java script:showFoto('MINHAFOTOAQUI.jpg');", "_self");

Agora, é só publicar, botar o SWF no html preparado e só alegria =D

Obs.: Para o efeito ficar completo, é necessário o SWF estar com fundo transparent(wmode=transparent) ou opaco(wmode=opaque), para que o lightbox não fique por trás do SWF.


É isso aí pessoal, divirtam-se!

[NinoSPFC]

Muito legal... funcionou só corrigir aqui..

CODE

getURL("java script:showFoto('MINHAFOTOAQUI.jpg');", "_self");

javascript tem que ser junto.

Valeu

[triko]

Pois é, mas é que o forum não permite que fiquem juntos, então fica a dica aí pro pessoal.

[]'s

[rodrigo366]

Olá Triko................tentei de tudo para fazer funcionar no meu arquivo Flash o Lightbox mas não deu. Eu fiz um site (em Flash) e nele tem um menu que chama outros movies que abrem no corpo do site. Neste menu tenho o tópico "Galeria de Fotos" e nas fotos queria utilizar o Lightbox, mas não consigo. Inclusive “revirei” a internet atrás de um site em Flash que utilizasse o lightbox e também não encontrei nenhum exemplo. Se você pudesse me enviar um exemplo ou verificar se o comando que você postou realmente funciona ficaria muito grato!

[triko]

Oi Rodrigo,

Olha, na realidade eu não sei se o lightbox funciona em sites com a interface totalmente em flash.
Fiz um exemplo usando flash+html e funcionou direitinho, sem glasho. É bem simples e fácil de ser feito.

No caso depois eu vou colocar um link aqui para você dar uma olhada no código fonte. Ele é feito da mesma maneira que se fosse feito em HTML puro, apenas o botão em flash é que leva um AS para executar o lightbox.

Até depois então!

[]'s

[NinoSPFC]

Rodrigo vc deu permissão para as imagens? chmod?

[Fargas]

Triko,

Estou fazendo um site totalmente em Flash.
Usei o procedimento citado no inicio deste topico e, até o momento, está funcionando legal.
Quer dizer, quase legal.
O único "defeito" é que quando a foto aparece, eu perco a transparencia do fundo.
A cor em torno da foto fica um cinza bem escuro, e vc nao vê o fundo.
Em outros sites que eu visitei e que usam o Light Box, a gente vê o fundo parcialmente, com uma ligeira transparencia.

Vc saberia como corrigir isto?

Abs

Fargas

[triko]

Me passe o link do seu site para eu dar uma visualizada. E realmente Fargas, vc tem razão, é possível fazer totalmente em flash, eu fiz aqui e deu certo.

Acho que talvez seja a configuração de cores no CSS, bem, posta o link do seu site pra dar uma olhada blz?

Abraço cara!

Triko,

Estou fazendo um site totalmente em Flash.
Usei o procedimento citado no inicio deste topico e, até o momento, está funcionando legal.
Quer dizer, quase legal.
O único "defeito" é que quando a foto aparece, eu perco a transparencia do fundo.
A cor em torno da foto fica um cinza bem escuro, e vc nao vê o fundo.
Em outros sites que eu visitei e que usam o Light Box, a gente vê o fundo parcialmente, com uma ligeira transparencia.

Vc saberia como corrigir isto?

Abs

Fargas

[Fargas]

Oi Triko, blz?

Cara, nao me interprete mal, mas o site ainda esta' em fase de testes pelo cliente e eu fico achando que pode nao ser muito legal divulgar a URL antes do cliente dar o ok.
Mas assimque eu publicar o site, o que deve acontecer esta semana ainda, eu te mando a URL, ok?

Agora me fala uma coisa: vc sabe se tem jeito de fazer o lightbox funcionar (no Flash, é claro) mostrando as imagens anteriores e posteriores? Usando html é fácil...
Seguindo o tutorial eu só consigo mostar uma imagem de cada vez. Será que tem jeito?

abs

Fargas

[triko]

Relaxa Fargas, vc está corretissímo em não mostrar o trabalho sem a aprovação do seu cliente.

Quanto ao Light, bem, tentei coloca-lo em um site totalmente em flash, mas não rolou pq não tem como deixar o fundo transparente, uma vez que usei imagens no bakground do site.

No caso, ele funciona sussegado se o fundo do flash estiver transparente, sem imagens de fundo.
Quanto ao "next" e "preview" do light-box, este eu também não testei, mas já vi um website em flash + html e o mesmo não utilizou estes recursos e poderia ter usado, pois ficaria melhor. Agora não sei se quem desenvolveu o mesmo não sabia deste recurso, ou não o colocou por opção, ou não colocou porque não é possível.
Então vou fazer algo aqui neste sentido para testar e depois posto aqui!

[]'s e fica com Deus!

Oi Triko, blz?

Cara, nao me interprete mal, mas o site ainda esta' em fase de testes pelo cliente e eu fico achando que pode nao ser muito legal divulgar a URL antes do cliente dar o ok.
Mas assimque eu publicar o site, o que deve acontecer esta semana ainda, eu te mando a URL, ok?

Agora me fala uma coisa: vc sabe se tem jeito de fazer o lightbox funcionar (no Flash, é claro) mostrando as imagens anteriores e posteriores? Usando html é fácil...
Seguindo o tutorial eu só consigo mostar uma imagem de cada vez. Será que tem jeito?

abs

Fargas

[mas.marco]

Fiz exatamente o explicado.. e simplesmente nao funciona....

no flash:

CÓDIGO

bt_exec.onRelease = bt_exec2.onRelease = bt_exec3.onRelease = function () {
    getURL("java script:showFoto('flavio.jpg');", "_self");
}

no html, que contem o swf:

CÓDIGO

<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<script src="Scripts/prototype.js" type="text/javascript"></script>
<script src="Scripts/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="Scripts/lightbox.js" type="text/javascript"></script>
<link rel="stylesheet" href="Scripts/lightbox.css" type="text/css" media="screen" />
<script type="text/JavaScript">
function showFoto(src)
{
    var a_false = document.createElement("A");
    a_false.rel = "lightbox";
    a_false.href = src;
    myLightbox.start(a_false);
    a_false = null;
}
</script>

E lá no swf, deixei transprente....

Quando eu clico nos botoes, nada, nada acontece.

[Natan]

Veja se quando você abre sua página HTML aparece no canto alguma mensagem de erro do JavaScript.

Outra coisa, no Flash, o javascript tem que estar junto e não separado, o fórum separa para não dar nenhum problema de conflito.

[]s

[f-gos]

eu tbm to com problemas...fiz tudo certo mas num rola tbm.......... ta dando erro de javascript

código: 0
caractere: 5
erro: 'myLightbox' não esta definido

oq pode ser esse erro?????????????

segue o link se alguem quizer conferir

http://www.contin.com.br/montex/index2.html

[Fernando Pellense]

e quando meus botões são gerados por um xml???

title="REF 1422"

description="Camisa manga longa masculino" />

<thumbnail filename="ref1422.jpg" url="http://www.meudominio.com/imagens/ref1422.html" target="_parent"

como ficaria o xml? ali ele puxa o html e dentro do html puxa a imagem jpg

ou para isso deveria mudar o código de como ele busca o link do xml no flash?


vlw

[yauch 12]

alguém poderia me mandar um link de um site com lightbox com flash obrigado... obrigado

[quinhone]

Olá, fiz aqui também um exemplo simples e não rolou, não aparece erro de JS e também ao clicar no btn, não faz nada.
uso o CS3 AS 2.0

Att

Luis Carlos

[yauch 12]

Cara então tem allgum para mim ver, que seja em flash com js para mim ver??
valew!

[ubi_rj]

Olha esse tutorial aqui:
http://blog.codefidelity.com/?p=18

Abração !

[vitor chaves]

Olá, eu gostaria de saber onde fica o myLightbox ?

[fabinhokriok]

Eu ainda não descobri onde eu tô errando.
- Eu uso o Flash Professional 8;
- O Lightbox tá devidamente instalado, seguindo as instruções do site;
- A imagem também tá lá, no diretório correto;

Esse é o html de teste:

CÓDIGO

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Lightbox no Flash</title>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript">
function showFoto(src)
{
    var a_false = document.createElement("A");
    a_false.rel = "lightbox";
    a_false.href = src;
    myLightbox.start(a_false);
    a_false = null;
}
</script>
</head>
<body bgcolor="#FFFFFF">
<!--url's used in the movie-->
<a href="java script:showFoto('images/colar12.jpg');"></a>
<!--text used in the movie-->
<!-- saved from url=(0013)about:internet -->
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="550" height="400" id="temp" align="middle">
<param name="allowScriptAccess" value="sameDomain" /><param name="wmode" value="transparent" />
<param name="movie" value="temp.swf" /><param name="quality" value="high" /><param name="bgcolor" value="#6699cc" /><embed src="temp.swf" quality="high" bgcolor="#6699cc" width="550" height="400" name="temp" align="middle" allowScriptAccess="sameDomain" wmode="transparent" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</body>
</html>

No Flash, coloquei um botão com o seguinte código:

CÓDIGO

on(release) {
    getURL("java script:showFoto('images/colar12.jpg');", "_self");
}

Já testei outros códigos e não deram certo também, alguma dica?

P.S.: O fórum separa a palavra 'javascript', aqui tá tudo certo.

[fabinhokriok]

Eu encontrei esse tópico na busca:
http://www.mxstudio.com.br/forum/index.php...amp;hl=lightbox

Entrei no site indicado e segui todas as orientações, mais erros. Vou colocar uma cópia do meu comentário para o Natan pra vocês saberem quais erros.

E aí, Natan.
Eu uso o Flash 8 e AS2 e os problemas persistem...

Pra quem não tem um site totalmente em Flash e vai usar o AS2 (meu caso):
"Quem for usar o ActionScript 2, as ações são essas:

CÓDIGO

bt.onPress = function() {
   flb.carregaHTML("sua imagem.jpg", "seu texto");
};

"

Resultado:
"**Error** Scene=Scene 1, layer=Layer 1, frame=1:Line 1: Statement must appear within on handler
bt.onPress = function() {

Total ActionScript Errors: 1 Reported Errors: 1"

Só funciona dessa maneira:

CÓDIGO

on(press) {
   flb.carregaHTML("sua imagem.jpg", "seu texto");
}

E no final das contas, não funciona. O arquivo *.fla do zip que você colocou aqui dá erro: "Unexpected file format" (sim, eu baixei a versão pra AS2).

[Lino]

...

Muito fera o tuto. Mas algo que venho tentando sem sucesso é conseguir mostrar conteúdo HTML disparado por um botão dentro de um flash. Coisinha complicada viu