Natan Alves - Flash Developer
RSS

FlashLightBox


FlashLightBox é um Componente que permite que o efeito LightBox presente em algumas páginas HTML possa ser usado em arquivo do Flash usando apenas ActionScript. Esse Componente foi feito para usuários que possuam páginas feita inteiramente no Flash (e ocupando 100% do browser) e para usuários que possuam algum conteúdo do Flash (swf) no site. Se seu site não for 100% feito no Flash, será necessário usar o arquivo JavaScript que faz o efeito original, o Componente só fará a ponte do Flash para esse JavaScript. Os arquivos JavaScript necessários estão no arquivo zip disponibilizado aqui.

Requisitos necessários

Esse Componente foi feito usando o ActionScript 3 e ActionScript 2. Para quem quiser usar a versão em ActionScript 2, os requisitos necessários são:

  • Mínimo FlashPlayer 8
  • Funciona no Flash 8, Flash CS3 3, Flash CS4 e Flash CS5

Quem quer usar a versão em ActionScript 3, os requisitos são:

  • Mínimo FlashPlayer 9
  • Funciona no Flash CS3, Flash CS4 e Flash CS5

FlashLightBoxVideo

Agora é possível exibir vídeos no formato FLV usando o Componente FlashLightBoxVideo. Esse Componente está disponível para usuários do ActionScript 2 e ActionScript 3 e podem ser baixados nos links citados abaixo.

Download Componente

O Componente pode ser baixado em duas versões:

Como usar

Parte 1 – Instalação Componente versão ActionScript 3

Após fazer o download do Componente na versão AS3, copiem os arquivos FlashLightBoxAS3.swc e FlashLightBoxVideoAS3.swc para o diretório onde estão instalados os Componentes do Flash. Para usuários do Flash CS3 o caminho é:

  •  (Windows) C:/Arquivos de Programas/Adobe/Adobe Flash CS3/linguagem/Configuration/Components
  •  (Mac OS X) Macintosh HD/Applications/Adobe Flash CS3/Configuration/Components

Onde linguagem é a linguagem na qual o Flash foi instalado. Para usuários do Flash CS4 e Flash CS5 o caminho é:

  •  (Windows) C:/Arquivos de Programas/Adobe/Adobe Flash versão do flash/Common /Configuration/Components
  •  (Mac OS X) Macintosh HD/Applications/Adobe Flash versão do flash/Configuration/Components

Parte 2 – Instalação Componente versão ActionScript 2

Após fazer o download do Componente na versão AS2, copiem os arquivos FlashLightBoxAS2.swc e FlashLightBoxVideoAS2.swc para o diretório onde foi instalado o Flash. Quem for usar essa versão no Flash CS3, Flash CS4 ou no Flash CS5 o caminho a ser movido o Componente é o mesmo mostrado acima. Quem usa o Flash 8, o caminho é:

  • (Windows) C:/Program Files/Macromedia/Flash 8/linguagem/Configuration/Components
  • (Mac OS X) Macintosh HD/Applications/Macromedia Flash 8/Configuration/Components

Onde linguagem é a linguagem na qual o Flash foi instalado.

Parte 3 – Configurando o Componente

Abram o Flash e criem um novo arquivo. Abram o painel Components (Ctrl+F7) e joguem para o palco o Componente FlashLightBox. Selecionem o Componente e abram o painel Parameters ou Component Inspector, algumas opções do Componente poderão ser alteradas:

Opções de personalização

Atenção: A personalização do Componente só será válida caso use as funções reservadas a um site feito inteiramente no Flash, caso seu site não seja totalmente em Flash e tiver que usar o JavaScript, a personalização terá que ser feita através do arquivo CSS do LightBox.

Parte 4 – Funções do Componente

Como já sabem, o Componente foi feito para quem possui um site feito inteiramente em Flash (e ocupando 100% do browser) e para quem possui algum conteúdo do Flash (swf) na página.

Site feito inteiramente no Flash ocupando 100% do Browser:

  • carrega(arquivo:String, legenda:String, link:String) – função responsável por carregar uma imagem, exibir sua legenda e oferecer opção para abrir um link quando clicar na imagem. Recomendada para usuários que possuem um site feito inteiramente no Flash.
  • carregaMultiplos(arquivos:Array, legendas:Array, links:Array, num:Number) – função responsável por carregar várias imagens (uma de cada vez) habilitando opção de carregar próxima imagem ou carregar anterior. Função recomendada para usuários que possuam um site feito inteiramente no Flash.

Algum conteúdo swf no site:

  • carregaHTML(arquivo:String, legenda:String) – função responsável por carregar uma imagem e exibir sua legenda. Recomendada para os usuários que não tem um site feito inteiramente no Flash. Será necessário usar JavaScript para o efeito.
  • multiploHTML(arquivo:Array, legenda:Array) – função responsável por carregar várias imagens (uma de cada vez) habilitando opção de carregar próxima imagem ou carregar anterior. Função recomendada para usuários que não possuam um site feito inteiramente no Flash. Será necessário usar JavaScript para o efeito.

Parte 5 – Usando o Componente

Após ter jogado o Componente no palco e customizado ele através do painel Parameters ou Component Inspector, é necessário instanciar esse Componente. Selecione o Componente e abra o painel Properties e no campo Instance Name de o nome que desejar, para esse exemplo usarei o nome flb. Criem um botão e dêem nome de instancia de bt. Quem for usar o Componente em um site feito inteiramente no Flash e estiver usando o ActionScript 3, insiram as seguintes ações:

bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.carrega("sua imagem.jpg", "seu texto", "seu link");
}

Para quem for usar ActionScript 2, as ações são essas:

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

Caso não queira inserir um link na imagem, basta deixar o valor do parametro link vazio que o Componente verifica se existe algum link nele para habilitar essa opção.

Para quem deseja carregar múltiplas imagens e usar ActionScript 3, utilizem as seguintes Ações:

var fotos:Array = ["imagem1.jpg", "imagem2.jpg", "imagem3.jpg"];
var textos:Array = ["texto1", "texto2", "texto3"];
var links:Array = ["link1", "link2", "link3"];
bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.carregaMultiplos(fotos, textos, links, 1);
}

Para quem for usar o ActionScript 2, as ações são essas:

var fotos:Array = ["imagem1.jpg", "imagem2.jpg", "imagem3.jpg"];
var textos:Array = ["texto1", "texto2", "texto3"];
var links:Array = ["link1", "link2", "link3"];
bt.onPress = function() {
   flb.carregaMultiplos(fotos, textos, links, 1);
};

Para quem não tem um site inteiramente feito com o Flash e usar o ActionScript 3, insiram as seguintes ações:

bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.carregaHTML("sua imagem.jpg", "seu texto");
}

Quem for usar o ActionScript 2, as ações são essas:

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

Para carregar múltiplas imagens usando ActionScript 3 usem as seguintes ações:

bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.multiploHTML("sua imagem.jpg", "seu texto");
}

Quem for usar o ActionScript 2, as ações são essas:

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

Além das ações, quem não tem um site feito inteiramente no Flash, é necessário baixar o JavaScript do LigthBox criado por Lokesh Dhakar e um JavaScript que facilita a interação do Flash com o JavaScript criado pelo Lucas Ferreira.

Parte 6 – Carregando Vídeos

Com o Componente FlashLightBoxVideo agora é possível exibir vídeos no formato FLV. Para carregar um vídeo, basta arrastar o Componente para o palco, instancia-lo, escolher qual estilo o player vai ter e usar a função carrega ou carregaMultiplos, o Componente consegue identificar a extensão do arquivo para verificar se o arquivo passado é um vídeo no formato flv ou não.

Seguindo os exemplos anteriores, abram o painel de Componentes e joguem o Componente FlashLightBoxVideo, instanciem ele com o nome de flb, criem um botão com instancia de bt e se estiverem usando ActionScript 3 as ações são essas:

bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.carrega("seu video.flv", "seu texto", "");
}

Reparem que no parametro link eu deixei vazio, isso porque não é possível inserir um link no vídeo e deixar o player funcionando, então mesmo que insiram um link o Componente irá ignorar o link passado. Se estiverem usando ActionScript 2 as ações são essas:

bt.onPress = function() {
   flb.carrega("seu video.flv", "seu texto", "");
};

Também é possível carregar vários vídeos e misturar vídeos com imagens. Se estiver usando ActionScript 3 essas são as ações necessárias:

var arquivos:Array = ["imagem1.jpg", "video.flv", "imagem3.jpg"];
var textos:Array = ["texto1", "texto2", "texto3"];
var links:Array = ["link1", "link2", "link3"];
bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.carregaMultiplos(arquivos, textos, links, 1);
}

Se estiver usando ActionScript 2 as ações são essas:

var arquivos:Array = ["video.flv", "imagem2.jpg", "imagem3.jpg"];
var textos:Array = ["texto1", "texto2", "texto3"];
var links:Array = ["link1", "link2", "link3"];
bt.onPress = function() {
   flb.carregaMultiplos(arquivos, textos, links, 1);
};

Uma atenção super importante: quem estiver usando o Componente FlashLightBoxVideo na versão para ActionScript 2 precisa ter em seu arquivo na biblioteca o Componente FLVPlayback para que o vídeo possa funcionar, já que não é possível criar o Componente usando apenas ActionScript. Usuários do ActionScript 3 não precisam fazer esse processo para poder usar o Componente.

Verificando quando o Componente terminou

Agora também é possível criar uma função que seja disparada quando o Componente tiver terminado de rodar. Se estiver usando o Componente na versão em ActionScript 3 as ações são essas:

bt.addEventListener(MouseEvent.CLICK, btPress);
flb.addEventListener("fecha", aoFechar);
function btPress(event:MouseEvent):void {
   flb.carrega("sua imagem", "seu texto", "seu link");
}
function aoFechar(event:Event):void {
   trace("FLB Fechou");
}

E se estiver usando na versão em ActionScript 2:

Stage.align = "TL";
var listener:Object = new Object();
flb.addEventListener("fecha", listener);
bt.onPress = function() {
   flb.carrega("sua imagem", "seu texto", "seu link");
};
listener.fecha = function() {
   trace("fechou");
}

Chamando o Componente através do ActionScript

Também é possível criar e personalizar o Componente usando apenas ActionScript. Para fazer isso, você precisam ter o Componente na biblioteca do seu arquivo, se ele não estiver na biblioteca não irá funcionar. Quem for usar ActionScript 3 as ações são essas:

/* Cria instancia da Classe FlashLightBox */
var flb:FlashLightBox = new FlashLightBox();
/* Adiciona ele ao palco */
addChild(flb);
/* Modifica o valor alpha do fundo */
flb.alphaFundo = 60;
/* Modifica cor do fundo */
flb.corFundo = 0xFF0000;
/* Modifica cor da borda */
flb.corBorda = 0xFF00FF;
/* Modifica cor preloader */
flb.corPreloader = 0xFF0000;
/* Modifica tamanho da legenda */
flb.tamanhoLegenda = 10;
/* Modifica a cor da legenda */
flb.corLegenda = 0x000000;
/* Se habilitado, deixa a imagem sempre centralizada */
flb.okResize = true;
/* Modifica a cor das setas */
flb.corSetas = 0xFFFFFF;
/* Se habilitado exibe opção de download da imagem */
flb.liberaDownload = true;
/* Modifica o idioma das mensagens exibidas */
flb.mudaIdioma = "Inglês";
/* Se habilitado, dimenciona imagem caso seja
    maior que a tela */
flb.okResizeImagem = true;
/* Se habilitado exibe porcentagem do carregamento da imagem */
flb.okPorcentagem = true;
/* Se habilitado, o fundo também pode fechar a
    imagem carregada */
flb.okFundo = true;
/* Possibilita modificar o arredondamento da borda */
flb.arredonda = 5;
/* Muda a janela que será usada caso usuário clique na imagem
   para abrir o link passado
*/
flb.mudaJanela = "_blank";
bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.carrega("sua imagem.jpg", "seu texto", "link");
}

Quem estiver usando ActionScript 2 as ações são essas:

/* Cria instancia da Classe FlashLightBox */
var flb:FlashLightBox = new FlashLightBox();
/* Modifica o valor alpha do fundo */
flb.alphaFundo = 60;
/* Modifica cor do fundo */
flb.corFundo = 0xFF0000;
/* Modifica cor da borda */
flb.corBorda = 0xFF00FF;
/* Modifica cor preloader */
flb.corPreloader = 0xFF0000;
/* Modifica tamanho da legenda */
flb.tamanhoLegenda = 10;
/* Modifica a cor da legenda */
flb.corLegenda = 0x000000;
/* Se habilitado, deixa a imagem sempre centralizada */
flb.okResize = true;
/* Modifica a cor das setas */
flb.corSetas = 0xFFFFFF;
/* Se habilitado exibe opção de download da imagem */
flb.liberaDownload = true;
/* Modifica o idioma das mensagens exibidas */
flb.mudaIdioma = "Inglês";
/* Se habilitado, dimenciona imagem caso seja
    maior que a tela */
flb.okResizeImagem = true;
/* Se habilitado exibe porcentagem do carregamento da imagem */
flb.okPorcentagem = true;
/* Se habilitado, o fundo também pode fechar a
    imagem carregada */
flb.okFundo = true;
/* Possibilita modificar o arredondamento da borda */
flb.arredonda = 5;
/* Muda a janela que será usada caso usuário clique na imagem
   para abrir o link passado
*/
flb.mudaJanela = "_blank";
bt.onPress = function() {
   flb.carrega("sua imagem.jpg", "seu texto", "link");
};

Se estiver usando o Componente FlashLightBox na versão para ActionScript 3, as ações necessárias são:

/* Cria instancia da Classe FlashLightBox */
var flb:FlashLightBoxVideo = new FlashLightBoxVideo();
/* Adiciona ele ao palco */
addChild(flb);
/* Modifica o valor alpha do fundo */
flb.alphaFundo = 60;
/* Modifica cor do fundo */
flb.corFundo = 0xFF0000;
/* Modifica cor da borda */
flb.corBorda = 0xFF00FF;
/* Modifica cor preloader */
flb.corPreloader = 0xFF0000;
/* Modifica tamanho da legenda */
flb.tamanhoLegenda = 10;
/* Modifica a cor da legenda */
flb.corLegenda = 0x000000;
/* Se habilitado, deixa a imagem sempre centralizada */
flb.okResize = true;
/* Modifica a cor das setas */
flb.corSetas = 0xFFFFFF;
/* Se habilitado exibe opção de download da imagem */
flb.liberaDownload = true;
/* Modifica o idioma das mensagens exibidas */
flb.mudaIdioma = "Inglês";
/* Se habilitado, dimenciona imagem caso seja
    maior que a tela */
flb.okResizeImagem = true;
/* Se habilitado exibe porcentagem do carregamento da imagem */
flb.okPorcentagem = true;
/* Se habilitado, o fundo também pode fechar a
    imagem carregada */
flb.okFundo = true;
/* Possibilita modificar o arredondamento da borda */
flb.arredonda = 5;
/* Muda a janela que será usada caso usuário clique na imagem
   para abrir o link passado
*/
flb.mudaJanela = "_blank";
/* Seleciona Skin do Componente FLVPlayback */
flb.setSkin = "url skin.swf";
/* Escolhe cor para o Componente FLVPlayback */
flb.skinBackgroundColor = 0x47ABCB;
/* Modifica alpha do Componente FLVPlayback */
flb.skinBackgroundAlpha = 0.85;
bt.addEventListener(MouseEvent.CLICK, btPress);
function btPress(event:MouseEvent):void {
   flb.carrega("sua imagem.jpg", "seu texto", "link");
}

E se estiver usando o Componente na versão em ActionScript 2.

/* Cria instancia da Classe FlashLightBox */
var flb:FlashLightBox = new FlashLightBox();
/* Modifica o valor alpha do fundo */
flb.alphaFundo = 60;
/* Modifica cor do fundo */
flb.corFundo = 0xFF0000;
/* Modifica cor da borda */
flb.corBorda = 0xFF00FF;
/* Modifica cor preloader */
flb.corPreloader = 0xFF0000;
/* Modifica tamanho da legenda */
flb.tamanhoLegenda = 10;
/* Modifica a cor da legenda */
flb.corLegenda = 0x000000;
/* Se habilitado, deixa a imagem sempre centralizada */
flb.okResize = true;
/* Modifica a cor das setas */
flb.corSetas = 0xFFFFFF;
/* Se habilitado exibe opção de download da imagem */
flb.liberaDownload = true;
/* Modifica o idioma das mensagens exibidas */
flb.mudaIdioma = "Inglês";
/* Se habilitado, dimenciona imagem caso seja
    maior que a tela */
flb.okResizeImagem = true;
/* Se habilitado exibe porcentagem do carregamento da imagem */
flb.okPorcentagem = true;
/* Se habilitado, o fundo também pode fechar a
    imagem carregada */
flb.okFundo = true;
/* Possibilita modificar o arredondamento da borda */
flb.arredonda = 5;
/* Muda a janela que será usada caso usuário clique na imagem
   para abrir o link passado
*/
flb.mudaJanela = "_blank";
flb.mudaJanela = "_blank";
/* Seleciona Skin do Componente FLVPlayback */
flb.setSkin = "url skin.swf";
/* Escolhe cor para o Componente FLVPlayback */
flb.skinBackgroundColor = 0x47ABCB;
/* Modifica alpha do Componente FLVPlayback */
flb.skinBackgroundAlpha = 0.85;
bt.onPress = function() {
   flb.carrega("sua imagem.jpg", "seu texto", "link");
};

Recomendações

Só usem o Componente FlashLightBoxVideo se for querer exibir algum vídeo, porque o Componente usa o Componente FLVPlayback que acaba adicionando um peso extra ao arquivo final. O peso não é muito significativo, mas dependendo do tamanho de seu arquivo atual pode significar alguns segundos a mais na hora de carregar seu arquivo para o usuário.

Exemplos

Imagens individuais 

Somente Flash

Componente e JavaScript

Imagens múltiplas

Somente Flash

Componente e JavaScript

Abandono da versão em ActionScript 2

Decidi não continuar a versão do Componente em ActionScript 2 porque está se tornando cada vez mais complicado conseguir acompanhar as novidades usando o ActionScript 2 que está muito defasado comparado ao ActionScript 3. Portanto se desejam usar as novidades passem a programar usando ActionScript 3 que é uma linguagem muito mais completa e mais fácil comparado ao ActionScript 2. Só farei correções de possíveis bugs no Componente, novas opções só estarão disponíveis na versão em ActionScript 3.

Suporte

Caso tenham algum problema, entrem em contato através de meu site ou através do Blog.

Doações

Caso queiram, agradeceria muito a doação de qualquer valor. A doação pode ser feita através do PagSeguro. A doação não é obrigatória para o uso do Componente. Obrigado

Compartilhe:

Comentários

  1. Natan, só uma dúvida, tem como dar um play automático no flv? quando o mesmo é carregado?

    Rony Torres
    15/04/2011

    • Olá Rony.
      Por enquanto não existe essa implementação, mas na próxima atualização dele será incluida pois nela será corrigida algumas coisas além de inserir algumas novidades.
      []s

      Natan Alves
      17/04/2011

  2. ola, estou com o mesmo problema do Dan!!!

    Oi Natan, td bom? Bom demais o seu tutorial do flashligthbox, porem to com um problema q nao estou sabendo como resolver… Fiz o site todo em flash, e qdo clico na imagem da galeria, ela abre normalmente pelo flashbox, porem joga todo o meu swf principal para o topo do lado esquedo (isso com o resise habilitado), se o resise estiver desabilitado, o swf fica correto, porem o flashboz carrega no meio pra direita…

    só que faço o que vc diz que seria a solução> > > Stage.align = “TL”;

    aqui não funciona, onde eu coloco esse codigo exatamente?
    vlw

    bruno
    29/04/2011

    • Olá Bruno.
      Se você coloca o align o Flash irá alinhar seu arquivo no topo esquerdo, se estiver fazendo um alinhamento diferente pelo HTML pode ocorrer esse problema. Ou deixa tudo como TL ou não deixa habilitado o resize.
      []s

      Natan Alves
      27/05/2011

      • Olá Natan, creio que eu esteja com o mesmo problema que o Bruno, o Daniel e o Gustavo…
        Não gosto de pedir ajuda, até porque google tem resposta pra quase tudo (:

        É o seguinte, meu movie principal tem 600px de altura, mas, ele tá alinhado embaixo, deixando a parte que sobra (bg) completando a de cima (pra dar fullscreen e tal sem redimensionar a imagem. Tá, ok, mas e aí?

        O componente vai sempre alinhar pro _x = 0 e pro y_= 0 certo?
        Se eu ponho o Stage.align = “TL”; meu movie principal sobe e corta a parte que eu deixei sobrando… (o que acontece com o resize habilitado tb)

        Ou, se eu deixo o Resize desabilitado, o lightbox abre do meio pra baixo (onde realmente começa o stage)…

        e agora José? vou ter q mudar tudo pro lightbox em .js? 🙁
        to quase chorando aqui, varei a noite tentando resolver isso, uiaahuiahaiua

        se der pra me ajudar, tá rodando em http://tenente.atwebpages.com no link da camera fotográfica, e de preferencia em outro navegador sem ser o Firefox, pq esse servidor eh um cocô! (:

        []’s
        brigadão desde já, e parabéns ae (:

        Danilo Bretas
        27/07/2011

      • Olá Danilo.
        Infelizmente vai ter que mudar o seu código ou partir pro LightBox em JS. Estou meio enrolado esses dias então vai demorar um pouco pra sair uma versão mais nova do Componente onde vai ter uma opção agora pra escolher qual o tipo de alinhamento está usando para evitar esse tipo de confronto com arquivos que possuem outro tipo de alinhamento. Mas assim que tiver um tempinho disponível irei fazer a atualização.
        []s

        Natan Alves
        07/08/2011

  3. Olá Natan,

    Continuo me mantendo atualizado e utilizando seu componente, que tem sempre me ajudado muito no desenvolvimento.

    Porém encontrei um problema com a última atualização.
    Quando altero a cor, ou a opacidade ou habilito “fechar pelo fundo” o fundo simplesmente some. A imagem abre normalmente, o fundo fecha a imagem, tudo funciona, mas o fundo não aparece.

    Sabe me dizer se há alguma forma disso não acontecer?

    Obrigado pela atenção de sempre.

    Benisher
    01/07/2011

    • Olá Benisher.
      Testei aqui e não vi esse problema, qual versão do Componente está usando? Qual versão do ActionScript está usando?
      []s

      Natan Alves
      07/08/2011

  4. Meu irmão, muito bom o Tutorial, mas tenho uma dúvida, quando arrasto o componente pro palco, ele cria um quadradinho vermelho certo, ai trabalho na arte e tudo, e funciona certinho, a pergunta é, esse quadradrinho do começo, tem um lugar certo pra ele ficar, tamanho ou algo assim ???

    Milton Junior
    15/07/2011

    • Olá Milton.
      É só arrastar o Componente, pode deixar em qualquer lugar e não precisa mudar mais nada, pois tudo nele é criado via ActionScript.
      []s

      Natan Alves
      07/08/2011

  5. Olá Natan,

    Parabéns pelo trabalho.

    De uns dias para cá não consigo que o componente funcione mais, uso a versão AS2. Quando abro o vídeo sem erro, quando fecho, o restante dos botões do flash (restante do site) não funcionam mais.

    Também apresenta esse erro:
    ## [Tweener] Error: The property ‘_alpha’ doesn’t seem to be a normal object property of undefined or a registered special property.

    Christian
    26/07/2011

    • Olá Christian.
      Qual versão do Componente está usando? Testei aqui e não tive problemas na última versão.
      []s

      Natan Alves
      07/08/2011

  6. Olá Natan, eu não tenho muito conhecimento no Flash mas estou tentando melhorar meu site montando uma nova galeria, pois a atual está muito pesada. Então resolvi fazer o seu tutorial, porém não estou conseguindo, está dando um monte de erros.
    Agradeço quem puder me ajudar

    Janaina
    04/08/2011

    • Olá Janaina.
      Você precisa remover as ações que estão nos botões (seleciona ela e abra o painel de ações), depois você precisa instanciar todos os botões com nomes diferentes, exemplo: bt1, bt2, etc. Depois, no primeiro frame de seu arquivo (não importa qual camada) você insere as seguintes ações:
      var fotos:Array = ["GR1.jpg", "GR2.jpg", "GR3.jpg"];
      var textos:Array = ["texto1", "texto2", "texto3"];
      var links:Array = ["link1", "link2", "link3"];
      bt1.onPress = function() {
      flb.carregaMultiplos(fotos, textos, links, 1);
      }
      bt2.onPress = function() {
      flb.carregaMultiplos(fotos, textos, links, 2);
      }
      bt3.onPress = function() {
      flb.carregaMultiplos(fotos, textos, links, 3);
      }
      //etc

      Enviei para seu E-mail seu arquivo com essas modificações, você precisa continuar pra funcionar.
      []s

      Natan Alves
      07/08/2011

  7. Olá Natan!!!
    Parabéns pelo site, está me ajudando muito, estou com o problema do site em 100% resize habilitado. Gostaria de saber se você já conseguiu resolver isso no component. Obrigado.

    Rafael Bagatini
    25/08/2011

    • Olá Rafael.
      Ainda não, assim que possível postarei novidades.
      []s

      Natan Alves
      03/10/2011

  8. Ola Natan, muito bom o tutorial!

    Estou com o mesmo problema do Dan e do Bruno.
    Fiz o site todo em flash AS2, e qdo clico na imagem da galeria, ela abre normalmente pelo LightBox , porem joga todo o meu swf principal para o topo do lado esquedo (isso com o resise habilitado), se o resise estiver desabilitado, o swf fica correto, porem o LightBox carrega no meio pra direita… Usando o Stage.align = “TL” o site fica a esquerda e o LightBox fica centralizado. Queria que o site ficasse centralizado igual ao LightBox. É possível?

    Desde já agradeço pelo ótimo trabalho!
    Abraço.

    Leandro
    26/08/2011

    • Olá Leandro.
      Por padrão, quando você seleciona a opção Resize Habilitado o Componente é alinhado no como Top Left, por isso seu site é movido. Só que o alinhamento TL é o alinhamento correto e mais fácil de ser trabalhado, porque ao deixar seu swf com alinhamento TL todos os objetos (MovieClips, botões, componentes, etc) no seu palco são alinhados a partir das coordenadas X e Y igual a 0 (igual ao que você faz quando posicona seus itens no palco, você sempre deixa os objetos acima de 0 nos eixos X e Y). Quando você deixa a opção do Resize desabilitado o Componente alinha conforme você escolheu para seu swf, então se ele está alinhando no meio pra direita provavelmente seu swf está com o alinhamento Top, e esse alinhamento a posição 0 no eixo X fica exatamente no centro da tela, então o fundo do Componente fica alinhado nessa posição e não tem como prever esse espaço. A solução é mudar seu alinhamento pra TL e posicionar seus itens no centro usando a função onResize para alinha-los via ActionScript no centro da tela. Para a próxima atualização irei adicionar uma opção pra escolher o tipo de alinhamento e espero resolver esse tipo de problema, mas não posso te dizer quando vai sair pois estou super ocupado com outros projetos, mas até o final do ano espero lançar outra versão.
      []s

      Natan Alves
      03/10/2011

  9. Achei que esse componente é legal porém não funciona com imagens multiplas, descartando assim a navegabilidade o original lightbox.

    A imagem anterior e proxima só funciona no exemplo que você publicou no servidor ao qual hospeda seus exemplos.

    No meu caso só funciona imagem próxima e anterior quando as extremidades esquerda e direita da janela do navegador estão a uns 80 pixels + ou – próximos da borda das imagens carregas pelo componente.

    Quando a janela do navegador está 100% só funciona a seta próxima imagem com exceçao do seu exemplo, e o mais engraçado é que o seu exemplo desponível para dawnload também não funciona a imagem anterior.

    só funciona qdo a borda da janela do navegador está aproximadamente uns 90 pixels de distancia da borda da imagem.

    Acho que você poderia mudar isso no componente para que as setas proxima e anterior variem de acordo com a tamanho da imagem a ser carregada não com o tamanho da janela do browser…

    Rafael
    23/09/2011

    • Olá Rafael.
      Testei aqui e o Componente funciona corretamente. As setas são posicionadas próximo a imagem, então é independente do tamanho da imagem. Posta pra mim a url do seu exemplo para que eu possa entender o que está errado e tentar simular esse problema.
      []s

      Natan Alves
      03/10/2011

  10. Bom dia Natan,

    Preciso saber como faço para colocar no lugar da imagem, que aparece no lightbox, um texto com barra de rolagem ???
    Tenho alguns produtos e não gostaria de criar uma página para cada produto com a relação dos mesmo. Queria que esta informação aparecesse no lightbox.

    Abraço.

    Flavio Spina
    11/10/2011

    • Olá Flávio.
      Infelizmente o Componente só carrega arquivos, então você não pode dizer pra ele o que fazer pois ele sempre vai tentar carregar o arquivo passado na função carrega. A minha sugestão é fazer um swf com o seu texto e barra de rolagem com os produtos e carregar o swf no Componente.
      []s

      Natan Alves
      16/10/2011

  11. 1 2 3

Comentar





XHTML: Você pode usar as seguintes tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>