Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

carlosvolp

Efeito Lightview, lightbox

Por , em Desenvolvimento frontend

Recommended Posts

carlosvolp    0

carlosvolp
Postado

Como crio este tipo de efeito alguem sabe me dizer? http://forum.imasters.com.br/public/style_emoticons/default/grin.gif

 

 

De um clique em algum produto para abrir a página e depois clique na foto para ampliar.

http://www.foston.com.br/loja/

 

Titulo Editado:

Sai: Como criar este tipo de efeito, janela fundo preto

Entra: Efeito Lightview, lightbox, como criar...?

Compartilhar este post

Link para o post
Compartilhar em outros sites

carlosvolp    0

carlosvolp
Postado

cara, isso é feito com lightview.. existem diversos scripts em JS que fazem este efeito.

 

 

http://www.nickstakenburg.com/projects/lightview/

 

 

http://forum.imasters.com.br/public/style_emoticons/default/grin.gif pow cara valew mesmo muito obrigado ajudou bastante, so tenho mais uma divida http://forum.imasters.com.br/public/style_emoticons/default/grin.gif , usando lightview tem como abrir um arquivo swf ao envez de jpg

Compartilhar este post

Link para o post
Compartilhar em outros sites

carlosvolp    0

carlosvolp
Postado

Bom aqui estou eu de novo para deixar a resposta de minha duvida que teve inico da ajuda do amigo RoXbY, não vi referencias aqui no forum nem em algum site pelo menos em português sobre inserir arquivo flash em uma ligthbox então vou compartilhar dessa informação para quem mais queira caso já alguem tenha feito isso pesso desculpas rsrs.

 

Bom estou usando Lightbox2.03.3 e pode ser abaixado aqui >>>LINK<<<

arquivo para o flash aqui: >>>LINK<<<

lembrando queo arquivo ajax.swfsize.php deve ser colocado na pasta js.

 

Descompacta o arquivo e jogue as pasta dentro do diretorio de seu site junto ao arquivo index.html,*.asp, etc...

 

Em sua página onde voce for inserir os links coloque o seguinte código. entre as tag <head></head>

 

<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>

 

depois nos link basta fazer assim:

 

<p><a href='img/foto1.jpg' title="imagem1" rel="lightbox">Imagem</a>

para uma galeria de imagens acrecente [roadtrip]:

 

<p><a href='img/foto1.jpg' title="imagem1" rel="lightbox[roadtrip]">01</a>
<a href='img/foto2.jpg' title="imagem 2" rel="lightbox[roadtrip]">02</a>
<a href='img/foto3.jpg' title="imagem 3" rel="lightbox[roadtrip]">03</a>
<a href='img/foto4.jpg' title="imagem 4" rel="lightbox[roadtrip]">04</a> 
<a href="flash.swf" title="banner" rel="lightbox[roadtrip]">05</a>

Agora já esta funcionando pode testar.

 

Para fazer um arquivo SWF funcionar dentro faça o seguinte, abra o arquivo lightbox.js que se encontra dentro da pasta js.

procure a linha:

 

showImage: function(){

Element.hide('loading');

new Effect.Appear('lightboxImage', { duration: resizeDuration, queue: 'end', afterFinish: function(){ myLightbox.updateDetails(); } });

this.preloadNeighborImages();

}

 

e deixei assim:

 

showImage: function(){
		Element.hide('loading');
		new Effect.Appear('lightboxImage', { duration: resizeDuration, queue: 'end', afterFinish: function(){	myLightbox.updateDetails(); } });
		this.preloadNeighborImages();
	},
var swfSizeScript = "ajax.swfsize.php"
var swfSizeScript = "ajax.swfsize.php" é responsavel para inserir um arquivo swf.

 

Só tem um porem eu testei e nao funcionou junto com as imagens em uma galeria e tambem nao fecha a ação se alguem souber posta ai ^^ http://forum.imasters.com.br/public/style_emoticons/default/grin.gif

 

vlw galera.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito