JQuery em conflito com Prototype de Lightbox!

[Anderson Narciso 3]

Ae galera uso um menu com JQuery, mas fui colocar uma galeria de imagens utilizando lightbox e percebi que ao utilziar o lightbox o menu parava de funcionar (efeito do menu), ai fui direto aos links de ligação, desativei o link para o prototype do lightbox e o menu voltou a funcionar.. Alguém que já passou por isso tem alguma solução?

 

Grato dese já!

[Anderson Narciso 3]

Meu js caso ouver dúvidas ou se tiver que inserir algo nele..

<script type="text/javascript">

  $(function() { 
		
		$("ul#menu span").css("opacity","0");
		
		$("ul#menu span").hover(function () {
			
			$(this).stop().animate({
				opacity: 1
			}, "medium");
		},
		
		function () {
			
			$(this).stop().animate({
				opacity: 0
			}, "medium");
		});
	});
	
</script>

[desisto 0]

o problema é que ambos usam $

 

solução

 

 

 

 

jQuery.noConflict();

jQuery(document).ready(function(){

 

 

...

 

});

 

 

 

pode usar qq coisa no lugar de jQuery

[Anderson Narciso 3]

Pelo que entendi ficaria assim?

 

<script type="text/javascript">

  jQuery.noConflict();
  jQuery(document).ready(function(){

   $(function() { 
                
                $("ul#menu span").css("opacity","0");
                
                $("ul#menu span").hover(function () {
                        
                        $(this).stop().animate({
                                opacity: 1
                        }, "medium");
                },
                
                function () {
                        
                        $(this).stop().animate({
                                opacity: 0
                        }, "medium");
                });
        });

});	
</script>

Já tinha tentado esta forma, tinha dado uma olhada e encontrado no JQuery Brasil, comunidade da google, mas isso não resolveu, se é que usei da forma correta, me corriga por favor..

 

Grato!

[desisto 0]

você vai simplesmente trocar $ por qq outro nome que você quiser

 

jQuery.noConflict();

jQuery(function() { 
                
jQuery("ul#menu span").css("opacity","0");
                
jQuery("ul#menu span").hover(function () {
                        
jQuery(this).stop().animate({
                                opacity: 1
                        }, "medium");
                },
                
                function () {
                        
jQuery(this).stop().animate({
                                opacity: 0
                        }, "medium");
                });
        });

 

 

 

veja se funciona

[Anderson Narciso 3]

Acho que o conflito ele retirou, porque o menu nao funcionava o efeito, coloquei assim e agora funciona, mas já o lightbox ainda não funciona..

[desisto 0]

sempre que você usar o Jquery e o Proto. juntos será preciso usar aquele cod. que postei

 

se numa pagina você tiver 3 efeitos em jquery, vai ter que usar e mudar o $

[Anderson Narciso 3]

na real só tem aquele...mas você diz que tenho que mudar algo dentro dos arquivos do lightbox?

[desisto 0]

nao sei como esta o codigo, mas provavelmente precisa sim

 

mesmo que você tenha um .js na pagina, se nao me engano tera que mudar tb

[Anderson Narciso 3]

Na realidade não tem muita coisa, é o unico script inserido..

 

	<!-- Scripts -->
  <script defer type="text/javascript" src="pngfix.js"></script>
  <script type="text/javascript" src="swfobject.js"></script>
  <script src="anima.js" type="text/javascript"></script>

  <script type="text/javascript" src="prototype.js"></script>
  <script type="text/javascript" src="scriptaculous.js?load=effects,builder"></script>
  <script type="text/javascript" src="lightbox.js"></script>
  
  <!-- Include jQuery Biblioteca -->
  <script src="jquery.js" type="text/javascript"></script>
  <!-- Vamos a animacao -->
  <script type="text/javascript">

  jQuery.noConflict();
  jQuery(document).ready(function(){

  jQuery(function() { 
		
		jQuery("ul#menu span").css("opacity","0");
		
		jQuery("ul#menu span").hover(function () {
			
			jQuery(this).stop().animate({
				opacity: 1
			}, "medium");
		},
		
		function () {
			
			jQuery(this).stop().animate({
				opacity: 0
			}, "medium");
		});
	});
});	
</script>

:/

[desisto 0]

entao complicou...

 

essa é a unica alternativa pelo lado do Jquey, pq pelo Proto. nao conheco nada que resolva

 

 

 

 

qual erro?

[Anderson Narciso 3]

Não da exatamente um erro, ele simplesmente não abre em estilo lightbox, abre a imagem em uma janela normal.. muito chato isso, não poder usar em efeito bacana no menu e o lightbox por dar conflito :(

[desisto 0]

mantenha o topico aberto

 

a solucao que conheco é essa, mas pode ser que você tenha sorte e alguem responda com outra

[Anderson Narciso 3]

Cara troquei de lightbox, coloquei um mais simples, deu certo..

 

Mas mesmo assim é bom deixar o tópico aberto, porque o Visual lightbox que eu utilizava é uma ferramenta muito boa, é uma pena não poder usar assim por um conflito :/

 

Mas vlw a ajuda brother!

[Anderson Narciso 3]

Ei galera não devia colocar resolvido, não teve solução para o conflito do JQuery com o Prototype... então seria legal se alguém realmente conseguice a solução postace. Vlws!

Abraço.

[joaogil 1]

Eu também estou com este problema e não encontrei a solução ainda.

[Jair Humberto 2]

Desculpem estar ressuscitando esse tópico, eu o achei pelo google,

Eu tive o mesmo problema e resolvi seguir a dica do Desisto, então consegui, e quero deixar uma dica.

 

o meu caso era que eu queria estilizar o select com um plugin da jQuery e queria usar a lightbox 2 que usa

a prototype no mesmo projeto. Então seguindo a dica do Desisto, que é a mesma da documentação da jQuery:

 

http://docs.jquery.com/Using_jQuery_with_Other_Libraries

 

Eu consegui após perceber que o plugin da jQuery que eu estava usando, o selectbox, precisava sofrer essa mudança também.

Fazendo a alteração no plugin o problema de conflito foi resolvido.

[joaogil 1]

Eu também acabei encontrando e usando esta solução, funciou. Mas não achei a forma mais prática pelo fato de ter que alterar todos os shotcodes "$" por "jquery" nos nossos códigos. Seria melhor se existisse uma solução em que fosse alterado o código do prototype.js apenas 1 vez e pronto.

[NewCreative 0]

Pessoal, sobre esse detalhe do conflito, verifiquei que estão conseguindo solucionar de maneira fácil, mas estou apanhando aqui a 3 dias e nada, abaixo segue meu código, podem verificar onde está o erro?

 

Desta forma só roda o lightbox e a barra de rolagem não aparece.

<!-- lightbox - galeria de fotos -->
<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" />

<!-- jScrollPane - barra de rolagem -->
<link rel="stylesheet" type="text/css"  href="styles/jScrollPane.css" />
<script type="text/javascript" src="scripts/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="scripts/jquery.mousewheel.js"></script>
<script type="text/javascript" src="scripts/jScrollPane.js"></script>

<script type="text/javascript">
		
jQuery.noConflict();

jQuery(function()
{
   // this initialises the demo scollpanes on the page.
   jQuery('#pane1').jScrollPane({showArrows:true, scrollbarWidth: 17});
});
			
</script>

Obrigado

[PriscillaTavares 0]

Estou tendo o mesmo problema!

Em uma página que só tenho a chamada para o scrollpane, ela funciona normal.

Agora na página que preciso ter os dois, um desabilita o outro e ao colocar uma IMG no meu link o scroll para de rolar com o mouse.

Tentei usar o jQuery.noConflict e a página fica em branco.

Não entendo nada de js gente! Me ajudem!

 

Seguem os links das páginas em questão, talvez eu tenho feito algo errado mas quero aprender. Qualquer ajuda é valida pra mim!

 

http://www.igraficci.com.br/teste/clientes.html (página só com o scroll OK)

 

http://www.igraficci.com.br/teste/identidade.html (página que deve ter os dois rodando juntos, porem so o lightbox está funcionando)

 

Obrigada! :)