Ir para conteúdo

POWERED BY:

Arquivado

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

marcelo sampaio

[Resolvido] Problemas jcarousellite + prettyPhoto

Recommended Posts

Olá a todos, estou tendo problemas

com o agrupamento do jcarousellite + prettyPhoto

 

quando eu coloco no jcarousellite o rel="prettyPhoto[galeria]" do prettyPhoto funciona mas

o agrupamento vem triplicado pelo jcarousellite, por exemplo 3 imagens no jcarousellite quando clicado a janela modal aparece com 9 no agrupamento rel="prettyPhoto[galeria]" .

 


   <script language="javascript">

$(document).ready(function(){



$("#slide-produtos", this).find("#carrosel").jCarouselLite({
		btnNext: "#slide-produtos #bt-next",   
		btnPrev: "#slide-produtos #bt-previous",   
		visible: 3, 		
		auto: 4000, 		
		speed: 3000,		
		vertical: false

});



$("a[rel^='prettyPhoto']").prettyPhoto({theme: ‘facebook’,slideshow:5000, autoplay_slideshow:false});


       /*

       //já tentei colocar assim também mas não funciona
$('#carrosel ul li').click(function(){
	$(this).find("a[rel^='prettyPhoto']").prettyPhoto({theme: ‘facebook’,slideshow:5000, autoplay_slideshow:true});
})

*/




});
</script>

 

 

alguem tem alguma sugestão para esse problema?

 

desde já agredeço a atenção de todos

Compartilhar este post


Link para o post
Compartilhar em outros sites

como está o html ? desse trecho onde você coloca os atributos rel ?

Compartilhar este post


Link para o post
Compartilhar em outros sites

como está o html ? desse trecho onde você coloca os atributos rel ?

 

 


          <div id="slide-produtos">

                               <div id="bt-previous"><a href="#"></a></div>
                               <div id="bt-next"><a href="#"></a></div>

                               	<div id="carrosel">


                                      <ul>
                                           <li>
                                               <a href="imag/layout/modelo-produtos.jpg" rel="prettyPhoto[galeria]" title="Description on a single line.">
                                               	<div id="legenda">
                                                   	<h1>Produto</h1>
                                                       <p>Categoria</p>
                                                   </div>
                                                   <span></span><!-- img macara para arredondar a borda -->
                                                   <img src="imag/layout/modelo-produtos.jpg" /> 
                                               </a>
                                           </li>

                                           <li>
                                               <a href="imag/layout/modelo-produtos.jpg" rel="prettyPhoto[galeria]" title="Description on a single line.">
                                               	<div id="legenda">
                                                   	<h1>Produto</h1>
                                                       <p>Categoria</p>
                                                   </div>
                                                   <span></span>
                                                   <img src="imag/layout/modelo-produtos.jpg" /> 
                                               </a>
                                           </li>

                                           <li>
                                               <a href="imag/layout/modelo-produtos.jpg" rel="prettyPhoto[galeria]" title="Description on a single line.">
                                               	<div id="legenda">
                                                   	<h1>Produto</h1>
                                                       <p>Categoria</p>
                                                   </div>
                                                   <span></span>
                                                   <img src="imag/layout/modelo-produtos.jpg" /> 
                                               </a>
                                           </li>

                                      </ul>
                                	</div>  
                               </div>


Compartilhar este post


Link para o post
Compartilhar em outros sites

esse html está incorreto.

 

você não pode colocar tags nivel de bloco dentro de tags inline.

valide a marcação no w3c.

Compartilhar este post


Link para o post
Compartilhar em outros sites

será que esse que é o problema?

do agrupamento...?

 

queria saber uma forma da galeria reconhecer apenas o agrupamento.

teste o prettyPhoto tem o Jcoursel e fucionou legal mas quando coloco eles juntos tem um problema de replicação de dados

por exempro slides com 3 imagens no Jcoursel quando apliada com a galeria do prettyPhoto aparecem com de existisse 9 ( isso com o agupamento )

teeria alguma forma de fazer reconhecer as galerias individualmente? ex.: [galeria1] [galeria2] ....

 

agradeço pela atenção!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Salve salve a todos!

 

consegui a solução para o problema.

 

só foi inverter o script de configuração do jCoursel e do prettyPhoto, primeiro era assim era o que dava problema:

 

$("#slide-produtos #carrosel").jCarouselLite({
		btnNext: "#slide-produtos #bt-next",   
		btnPrev: "#slide-produtos #bt-previous",   
		visible: 3, 		
		auto: false, 		
		speed: 1000,		
		vertical: false

});

      $("a[rel^='prettyPhoto']").prettyPhoto({theme: 'facebook',slideshow:5000, autoplay_slideshow:false, social_tools:false});


 

 

################ DEPOIS (solução)

 


             $("a[rel^='prettyPhoto']").prettyPhoto({theme: 'facebook',slideshow:5000, autoplay_slideshow:false, social_tools:false});

             $("#slide-produtos #carrosel").jCarouselLite({
		btnNext: "#slide-produtos #bt-next",   
		btnPrev: "#slide-produtos #bt-previous",   
		visible: 3, 		
		auto: false, 		
		speed: 1000,		
		vertical: false

});


 

 

agora esta funcionando muito bem =D

 

agradeço a atenção de todos

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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