En un proyecto recientemente, tuve un pequeño y gran problema, un menu el site estaba hecho con Prototype y Mootools, y yo hice parte del proyecto aparte, al unirlo yo trabaje en jquery y me daba todo tipo de errores y conflictos.
Como hice, bueno leyendo en la web y principalmente en visualjquery.com me percate que existe una funcion de jquery que se llama .noConflict() el cual una de las funciones del mismo es cambiar el alias ($) a cualquier otro que deseamos.
El codigo que utilice fue el siguiente:
Antes
Query().ready(function(){
$("a.listaFull").toggle(
function(){
$("#resultado").slideDown(200);
},
function(){
$("#resultado").slideUp(100);
});
Despues
var j = jQuery.noConflict();
Query().ready(function(){
j("a.listaFull").toggle(
function(){
j("#resultado").slideDown(200);
},
function(){
j("#resultado").slideUp(100);
});
Que es todo esto, bueno
creamos un nuevos alias, pero de tipo noConflict() el cual hereda todas las funciones del jquery normal, de alli en adelante utilizamos a la j como si fuera $ de jquery, de esta manera no chocamos ni con prototype ni mootools.
19 comments ↓
Thank you!
Hola que tal amigo tengo un problema de scripts en mi blog de blogger ente jquery y prototype. Pero no se nada de scipts no se si me puedes ayudar a solucionarlo???
Gracias
A ver raul en que te puedo ayudar, no soy disque experto pero si te puedo ayudar venga…
muchas gracias mi buen no sabes como me ha ayudado, te debo una jeje, funciona a la perfecion.gracias
Podrian ayudarme!!! porfavor…. en la web que estoy haciendo… estoy utilizando dos diferente tipos de slide…simpre con jquery,, pero solo se activa uno….. si cambio el llamado del javascript de jquery en otra ubicacion me funciona uno y el otro no. y se lo vuelvo a poner en su lugar se desactiva y el otro funciona..no se como resover esto…. los que estoy utilizando son…en este mismo orden::::::
$(document).ready(function(){
$(“.btn-slide”).click(function(){
$(“#slide-panel”).slideToggle(“slow”);
});
});
var gaJsHost = ((“https:” == document.location.protocol) ? “https://ssl.” : “http://www.”);
document.write(unescape(“%3Cscript src=’” + gaJsHost + “google-analytics.com/ga.js’ type=’text/javascript’%3E%3C/script%3E”));
var pageTracker = _gat._getTracker(“UA-499901-1″);
pageTracker._initData();
pageTracker._trackPageview();
hola soy yo nuevamente no aparecieron muy bien el orden,,,,seria asi::::
slider.js
core.js
jquery.min.js
luego el script del segundo slide:::::
$(document).ready(function(){
$(“.btn-slide”).click(function(){
$(“#slide-panel”).slideToggle(“slow”);
});
});
y por ultimo la oren de un carrusel que se desconfigura cuando muevo el jquery de su lugar original:::
compiled.js
var gaJsHost = ((“https:” == document.location.protocol) ? “https://ssl.” : “http://www.”);
document.write(unescape(“%3Cscript src=’” + gaJsHost + “google-analytics.com/ga.js’ type=’text/javascript’%3E%3C/script%3E”));
var pageTracker = _gat._getTracker(“UA-499901-1″);
pageTracker._initData();
pageTracker._trackPageview();
Hola tengo un problema con unas imagenes que corren solas (mootools.js) y la galeria de lightbox (prototype.js)
Cómo hago para que funcionen juntas ??
Please ayudaaaa
Bueno sol, lamentablemente esa convinacion mootools con prototype no las he probado pero lo que pasa alli es que las 2 usan $ como acceso a las funciones propias y se pelean , en jquery hay algo que se llama noConlict() que lo llamas antes de comenzar a programar con tu jquery y ya arregla esto, pero con mootools no tengo idea. Lo que puedes hacer de repente es bueno si estas usando un slide, puedes usar uno basado en jquery y aplicar esto de noconclict.
http://vandelaydesign.com/blog/web-development/jquery-image-galleries/
Algunos slides en jquery.
Muchas gracias, la verdad, yo también tenia confictos, pero con mootools.js y jquery.min.js. Hice lo que comentas y funcionó perfecto!!
Excelente Gracias me soluciono un problema que tenia.
Uff… viejo este post… me alegro que te halla servido.
muy buen post, he resuelto un problema que tenia con esta ayuda…gracias
HOla amigos, quiero preguntarles porque estoy teniendo un conflicto con dos efectos en la misma página, los cuales son lightbox y jquery haciendo un slidedown o funciona uno o funciona el otro…conocen alguna solución? muchas gracias desde ya! y les dejo un link temporal de la página en cuestión asi no les copio todo el código aca..saludos!!
http://www.billeneyasociados.com/web/servicios.php
En vez de usar $(document).ready(function() {
// Muestra y oculta los menús
$(‘ul li:has(ul)’).hover(
function(e)
{
$(this).find(‘ul’).slideDown();
},
function(e)
{
$(this).find(‘ul’).slideUp(700);
}
);
});
var $ = jQuery.noConflict();
Utiliza
jQuery(document).ready(function() {
// Muestra y oculta los menús
jQuery(‘ul li:has(ul)’).hover(
function(e)
{
jQuery(this).find(‘ul’).slideDown();
},
function(e)
{
jQuery(this).find(‘ul’).slideUp(700);
}
);
});
En vez de utilizar $ para usar jQuery usa jQuery completo. asi no hace conficto con el $ de prototype.
Saludos..
Arcadio, muchas gracias! Lo probé y me aparecen los elementos del lightbox superpuestos en la página y un cuadrado negro encima de la parte superior..ahora lo subo para que lo veas…Me está volviendo loco Jquery!
sos mi idolo me salvaste! excelente ayuda
arcadio, pero en qué archivo de mi joomla debo poner el código q comentas?
Hola Jorge, si usas joomla te recomiendo usar un plugin que se llama SC jquery el mismo cuando lo instalas tienes que activarlo, despues le das la opcion de que el mismo te llame el jquery desde google, y carga un pequeño codigo que es el que hace que no haga conflicto, de alli en adelante en vez de usar $ para usar jQuery usa jQuery y listo, me ha servido mucho. Ahora si lo deseas poner a mano, en el template de joomla, templates/{tu_template}/index.php lo pones en el header, y listo todas las paginas generadas por ese template te van a cargar el jquery con el no Conflict.
Saludos.
Leave a Comment